如何在 Kendo 上使用 pagesize 选择所有行答案

【问题标题】：How can i select all rows using pagesize on Kendo如何在 Kendo 上使用 pagesize 选择所有行
【发布时间】：2017-11-29 19:49:09
【问题描述】：

我有必须选择整个网格行的复选框。一旦用户单击全选，它必须选择网格上的所有页面。

现在我可以获取网格上行的长度，但只有一个复选框被选中。既然我可以得到长度，我怎样才能让所有的复选框都被点击？

这是我的代码：

 function checkAll(ele)
    {

        var grid = $("#Grid1").data("kendoGrid");
        grid.dataSource.pageSize(grid.dataSource.data().length);
        console.log("Length" + grid.dataSource.data().length);

        var dataArea = gridElement.find(".k-grid-content");
        var gridTest = $('#Grid1 .checkbox');

        for (var i = 0; i < gridTest.length; i++) {
            var isChecked = $('#masterCheckBox').is(':checked')//!$(this).is(':checked');
            alert("isChecked" + isChecked);
            if (isChecked) {
                $('#Grid1.checkbox').prop('checked', 'checked');
                break;
            }
        };
    };

剑道网格

<div>

            @(Html.Kendo().Grid<model>()
            .Name("Grid1")
                  .Columns(columns =>
                  {
                  columns.Bound(x => x.roleName).Title("Role Names");
                  columns.Template(@<text></text>).ClientTemplate("<input type='checkbox' #= selected ? checked='checked':'' # class='checkbox' />")
                                              .HeaderTemplate("<input type='checkbox' class='checkbox' id='masterCheckBox' onclick='checkAll(this)'/>")
                                              .Width(30);
                  })

                  .Pageable(pageable => pageable
                    .Refresh(true)
                    .PageSizes(true)
                    .ButtonCount(5))
                  .Scrollable()
                  .Filterable()
                  .Sortable()

                  .Resizable(resize => resize.Columns(true))
                  .DataSource(dataSource => dataSource
                  .Ajax()
                  .PageSize(10)
                  .ServerOperation(false)
                  .Read(read => read.Action("", ""))))


        </div>

【问题讨论】：

标签： javascript asp.net-mvc razor checkbox kendo-grid

【解决方案1】：

您好，已经设法让所有复选框被下面的代码选中，然后循环遍历每个复选框并更新我的数据源。

var CheckedBoxes = $('input:checkbox').not(this).prop('checked', this.checked);

$("#masterCheckBox").click(function ()
{
    debugger
    var grid = $("#Grid1").data("kendoGrid");
    grid.dataSource.pageSize(grid.dataSource.data().length);
    console.log("Length of pages" + grid.dataSource.data().length);

    CheckedBoxes = $('input:checkbox').not(this).prop('checked', this.checked);
    for (var i = 0; i < CheckedBoxes.length; i++)
    {

    };
 }
});

【讨论】：