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>
}

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

第二列是TextBox。

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

怎么做？

Answer 1

像这样编辑你的视图，

@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>

希望它有所帮助，谢谢。

Answer 2

这是我用简化的例子来做到这一点。

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);
}

获取Checkbox选中的所有Form Collection值

2 个答案: