Question

我必须创建“全选复选框”选项，当我选择计数的每个复选框都起作用时，它可以工作，但是当我在ASP.NET MVC中实现时，当“全选”选项不起作用时，这是我的代码 javascript

var countChecked = function () {
        var n = $('input[name="DocNames"]:checked').length;
        $("#span").text(n + (n === 1 ? " document is" : " documents are") + " checked!");
    };
    countChecked();
    $('input[name="DocNames"]').on("click", countChecked);

    $('#select_all').click(function (e) {
        $(this).closest('table').find('td input[name="DocNames"]').prop('checked', this.checked);
    })

html代码

<table class="table">
<tr>
    <th>Documnet Name</th>
</tr>
<tr>
    <td><label><input type="checkbox" name="select_all" id="select_all" />Select All</label></td>
</tr>
@if (Model.Documents != null)
{
    foreach (var item in Model.Documents)
    {
        <tr>
            <td>
                <label>
                    <input type="checkbox" name="DocNames" value="@item.DocumentName.Trim()" />
                    @item.DocumentName.Trim()
                </label>
            </td>
        </tr>
    }
}
else
{

    <tr>
        <td>@ViewBag.NoDocuments</td>
    </tr>
}

<div id="span"></div>

Answer 1

如果您尚未使用@Andreas的建议解决问题（这是正确的答案），我将以一种答案格式再次表达它：

在您的代码中，您在每个复选框的单击事件上调用了countChecked（）。因此，countChecked（）会执行它的工作。

但是在SelectAll复选框的事件处理程序中，您忘记了再次调用countChecked（）。

因此，您必须在代码末尾调用它，就像这样：

$('#select_all').click(function (e) {
    $(this).closest('table').find('td input[name="DocNames"]').prop('checked', this.checked);
    countChecked();
})

或者，更笨拙的是，触发任何复选框的点击事件。

但是以上是最好的。

全选复选框

1 个答案: