javascript - Kendo Listview，添加了复选框，添加了全选，将选中和取消选中一次，不会再次选中所有。

Question

我需要一些帮助。我有一个 Kendo ListView :

 <form id="frmChk">
        @(Html.Kendo().ListView<thieme_ws3.Models.QaTestModel>(Model)
        .Name("testList")
        .TagName("fieldset")
        .HtmlAttributes(new { @class = "panel panel-primary panel-body" })
        .ClientTemplateId("template")
        )
        <br />
    </form>

我在引入的信息中添加了复选框:

<script type="text/x-kendo-tmpl" id="template">
        <div class="col-md-5">
        @Html.CheckBox("cb_#:Id#", new { @class = ".item", id = "cb_#:Id#" })  #=Name#
        </div>
    </script>

我添加了一个全选复选框:

 <label id="checkAll" class="checkbox">
        <input type="checkbox" id="all" name="all" /> Select all
    </label>

并添加了这个来触发它:

 $('#all').on('click', function (e) {
    //alert("I'm clicked!" + this.checked);
    var testList = $("#testList").data("kendoListView");
    var dataItems = testList.dataItems();

    //do thought to wrap the loop in a do while, caused the browser to stop
    {

        for (i = 0; i <= dataItems.length - 1; i++) {
            //alert(dataItems[i].id);
            var cb = $("#cb_" + dataItems[i].Id);
            if (this.checked) {
                cb.attr("checked", "checked");
            }
            else {

                (cb.removeAttr("checked"));
            }

        }
    }
    })

它将工作一次，选中所有框并取消选中所有框，但是当我再次选中全选时，它不会选择其他框。我确信这是我忽略的一些小事情，请帮忙。

Answer 1

试试这个(假设复选框是#teSTList的后代):

$('#all').on('change', function (e) {
    var isChecked = $(this).prop('checked');
    $("#testList").find('input[type="checkbox"]').prop('checked', isChecked);
})