通过jquery在razor生成的html中查找所有选中的复选框

Question

我需要捕获来自 MVC 模型的 razor foreach 生成的所有选定复选框。我需要使用 Jquery 来做到这一点。

我已经尝试捕获选择的内容和未选择的内容。我设法找到了一个，但仅此而已。我认为这是由于 html 的布局方式造成的。只有一个实际输入。

我已经尝试过使用，它可以让我得到复选框输入的值和检查的数量，但我需要 DisplayFor 的值。

  $('#mcalSubmit').on('click', function () {
    var subLines = [];
    $.each($("input[name='subLines']:checked"), function () {
        favorite.push($(this).val());
    });
    alert( subLines.join(", "));

});

我在这里有这些 div，我使用基于来自单独数据库的模型的 foreach 填写表格。用户选中 Displayfor 旁边的复选框 ..

<div class="card text-white bg-info mb-3 ml-3 hideMe " id="MCAL" style="min-width: 25rem; max-width: 25rem; ">
        <div class="card-header bg-primary">
            MCAL Sublines
        </div>
        <div class="card-body">
            <table id="mcalTBL" class="table">
                <tr></tr>
                @foreach (var item in Model)
                {
                    ULT = item.UniqLineType;
                    if (ULT == AL)
                    {
                        <tr>
                            <td class="text-white ">
                                <input type="checkbox" class="cbMCAL" value="sublineMcal" />
                                @Html.DisplayFor(modelItem => item.SubLine_Name)
                            </td>
                        </tr>
                    }
                }
            </table>
        </div>
        <div class="card-footer bg-secondary">
            <button class="btn btn-danger btn-md float-right" id="mcalSubmit">Submit</button>
        </div>
    </div>

我需要找到一种方法来捕获他们选择的复选框和表格行数据（在这种情况下，他们选择了哪个 DisplayFor 项目）.. 我必须这样做，因为我会将这些发送到控制器用于 db 插入之后。再次感谢您的帮助。

Answer 1

你应该添加这个代码

  $('#mcalSubmit').on('click', function () {
    var subLines = "";
    $.each($("input[name='subLines']:checked"), function () {
       subLines += $(this).val() +","
    });
   alert(subLines);
  });

还要加

    name='subLines' // add in your input checkbox code
   <input type="checkbox" name='subLines' class="cbMCAL" value="sublineMcal" />

在您的复选框代码中