获取选中复选框的所有表单集合值

Question

视图如下：

@using (Html.BeginForm("AddCreditLeave", "AdminLeaveCredit"))
{
    <div id="Container">
        <table>
            <tr style="background-color:#A9DDFF;color:Black;">
                <td>Select</td>
                <td>Staff Code</td>
                <td>Name</td>
                <td>Designation</td>
                <td>AL</td>
                <td>CL</td>
            </tr>
            @foreach (var person in Model.Empdetailslist)
            {
                <tr>
                    <td>
                        <input type="checkbox" name="sid" value="@person.staffcode"  id="chk"  />
                    </td>

                    <td>@Html.TextBoxFor(m => person.staffcode, new { @class = "ReadOnly", @readonly = "readonly", style = "width:180px; text-align:center" })</td>

                    <td>@Html.TextBoxFor(m => person.name, new { @class = "ReadOnly", @readonly = "readonly", style = "width:180px; text-align:center" })</td>

                    <td>@Html.TextBoxFor(m => person.designation, new { @class = "ReadOnly", @readonly = "readonly", style = "width:180px; text-align:center" })</td>

                    <td>@Html.TextBoxFor(m => person.ALLeave, new { style = "width:180px; text-align:center" })</td>

                    <td>@Html.TextBoxFor(m => person.CLLeave, new { style = "width:180px; text-align:center" })</td>
                </tr>
            }

        </table>
}

第一列是一个复选框，我显示十行。

第二列是一个文本框。

有一个保存按钮。单击保存按钮时，我想从选中复选框的表单集合中选择第二列的值。

如何做到这一点？

Answer 1

这就是我将如何通过一个简化的示例来做到这一点。

Working Fiddle

型号

public class AModel
{    
    public string Name { get; set; }            
    public string staffcode { get; set; }           
    public bool Checked { get; set; }          
}

注意Checked 属性

查看循环

@for(var i = 0; i < Model.Empdetailslist.Count; i++)
{
   <tr>
    <td>
        @Html.HiddenFor(m => Model.Empdetailslist[i].Name)
        @Html.HiddenFor(m => Model.Empdetailslist[i].staffcode)
        @Html.CheckBoxFor(m = Model.Empdetailslist[i].Checked)
    </td>
    <td>
        @Model[i].Name
    </td>
  </tr>
}

注意 for 循环而不是 foreach 以启用模型绑定和隐藏字段以允许将值回发到控制器

http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx/

管制员职位

[HttpPost]
public ActionResult AddCreditLeave(YourModel model)
{
   // property will be populated in model.Empdetailslist

    return View(list);
}

Answer 2

像这样编辑您的视图，

@using (Html.BeginForm("AddCreditLeave", "AdminLeaveCredit"))
{
    <div id="Container">
        <table>
            <tr style="background-color:#A9DDFF;color:Black;">
                <td>Select</td>
                <td>Staff Code</td>
                <td>Name</td>
                <td>Designation</td>
                <td>AL</td>
                <td>CL</td>
            </tr>
            @foreach (var person in Model.Empdetailslist)
            {
                <tr>
                    <td>
                        <input type="checkbox" name="sid" value="@person.staffcode"  id="@person.id"  />
                    </td>

                    <td>@Html.TextBoxFor(m => person.staffcode, new { @class = "ReadOnly", @readonly = "readonly", style = "width:180px; text-align:center", id="staffcode_@person.id" })</td>

                    <td>@Html.TextBoxFor(m => person.name, new { @class = "ReadOnly", @readonly = "readonly", style = "width:180px; text-align:center", id="name_@person.id" })</td>

                    <td>@Html.TextBoxFor(m => person.designation, new { @class = "ReadOnly", @readonly = "readonly", style = "width:180px; text-align:center", id="designation_@person.id" })</td>

                    <td>@Html.TextBoxFor(m => person.ALLeave, new { style = "width:180px; text-align:center", id="ALLeave_@person.id" })</td>

                    <td>@Html.TextBoxFor(m => person.CLLeave, new { style = "width:180px; text-align:center", id="CLLeave_@person.id" })</td>
                </tr>
            }

        </table>
        <input type="button" onclick="SavePersons();" />
}

使用此代码获取数组中所有选定的人员对象。

<script type="text/javascript">
function SavePersons() {
    var chkArr = document.getElementsByName('sid');
    var selectedPersonsArr = new Array();
    for(var i=0; i<chkArr.length; i++) {
        if(chkArr[i].checked == true) {
            var tmpPerson = new Object();
            tmpPerson.id = chkArr[i].id;
            tmpPerson.staffcode = document.getElementById('staffcode'+chkArr[i].id).value;
            tmpPerson.name = document.getElementById('name'+chkArr[i].id).value;
            tmpPerson.designation = document.getElementById('designation'+chkArr[i].id).value;
            tmpPerson.ALLeave = document.getElementById('ALLeave'+chkArr[i].id).value;
            tmpPerson.CLLeave = document.getElementById('CLLeave'+chkArr[i].id).value;
            selectedArr.push(tmpPerson);
        }
    }
    // Now array 'selectedPersonsArr' contains all selected Person objects
    // here you can send these objects to your controller through AJAX
}
</script>

希望对你有帮助，谢谢。