флажок с выбрать все - PullRequest
       16

флажок с выбрать все

0 голосов
/ 28 января 2019

Мне нужно создать счетчик флажков с опцией «выбрать все», он работает, когда каждый флажок, который я выбираю, работал, но при выборе всех опций он не работает, я реализую в 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>

1 Ответ

0 голосов
/ 28 января 2019

Если вы еще не решили свою проблему с предложением @ Andreas (что является правильным ответом), я повторю это снова в формате ответа:

В своем коде вы вызвали countChecked () длясобытие клика каждого из флажков.И, следовательно, countChecked () делает то, что делает.

Но в вашем обработчике событий для флажка SelectAll вы забываете снова вызывать countChecked ().

Так что вам нужно либо вызвать егов конце вашего кода, например, так:

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

Или, что более неуклюже, вызовите событие click для любого из ваших флажков.

Но вышеприведенное лучше.

...