如何选中 Telerik Kendo Grid 中的所有复选框

Question

我有一个带有复选框列的 Kendo 网格。我想选中网格中的所有复选框并将其保留在页面上。我有一个方法 CheckAll()，但它只检查 Kendo 网格的第一页。如何通过单击 link 或按钮来选中所有复选框？我的代码在这里：

<div style="text-align:right; font-size: 0.9em;height:28px;position: relative;">

        <span style="float:left;text-align:left;">
            <a href="#" onclick="checkAll();">Check All</a>&nbsp;
            <a href="#" onclick="uncheckAll();">Uncheck All</a>&nbsp;
            <a class="k-button k-button-icontext k-grid-Patient" id="hrefCheckedPatients" href="#" onclick="getChecked();">Export to PDF</a>&nbsp;
            <a href="#" id="lnkPdfDownload" style="display:none;" onclick="$(this).hide();">Download Generated PDF</a>
            <label id="checkedMsg" style="color:red;display:none;"></label>
        </span>

    </div>
 @(Html.Kendo().Grid<RunSummary>()
          .Name("CheckedPatients")          
          .DataSource(datasource => datasource
                .Ajax().PageSize(25)        
                .Sort(sort => sort.Add("UniqueId").Ascending())                        
                .Read(read => read.Action("GetRunSummaries", "PatientReport")))
          .Columns(columns =>
              {

                  columns.Bound(c => c.UniqueId).Title(ELSORegistry.Resources.Views.Home.HomeStrings.UniqueId)
                        .ClientTemplate("<input type='checkbox'  class='primaryBox' id='#= UniqueId #'>#= UniqueId #</input>");
                  columns.Bound(c => c.RunNo).Title(SharedStrings.Run);
                  columns.Bound(c => c.Birthdate).Title(SharedStrings.Birthdate).Format("{0:g}").Filterable(true);

                  columns.Bound(c => c.customAge).Title(SharedStrings.Age)
                         .Filterable(
                             filterable => filterable
                                 .UI("AgeFilter")
                                 .Extra(false)
                                 .Operators(operators => operators
                                     .ForString(str => str.Clear().IsEqualTo("Is equal to"))
                                     )

                       );

                  columns.Bound(c => c.TimeOn).Title(PatientStrings.DateOn)
                      .Format("{0:g}")
                      .Filterable(true);
                  columns.Bound(c => c.TimeOff).Title(PatientStrings.DateOff)
                      .Format("{0:g}")
                      .Filterable(true);
                  columns.Bound(c => c.DischargedAlive).Title(PatientStrings.DischargedAlive).Filterable(true).ClientTemplate("#= DischargedAlive ? 'Yes' : 'No' #");
                  columns.Bound(c => c.ShowSubmitted).Title(PatientStrings.Submitted).Filterable(true).ClientTemplate("#= ShowSubmitted ? 'Yes' : 'No' #");
                  columns.Bound(c => c.SupportTypeEnum).Title(PatientStrings.SupportType).Filterable(true);//.ClientTemplate("#= SupportType ? 'Yes' : 'No' #");
              }
          )
          .Pageable(p => p.PageSizes(new[] {10, 25, 50, 100}))
          .Sortable()
          .Filterable( )
          .Events( e => e.FilterMenuInit("FilterMenuFuncWithAge") ) // apply x [closing box] on pop up filter box
          )
<script type="text/javascript"> 


    function checkAll() {
        $('input').prop('checked', 'checked');
    }

    function uncheckAll() {
        $('input').removeAttr('checked');
    }
</script>

Answer 1

您需要更新 datasource 属性而不是视图。在 CheckAll 函数中尝试类似的东西：

var dataSource =('[name]="CheckedPatients"').data('kendoGrid').dataSource;
var data = dataSource.data();
var totalNumber = data.length;

for(var i = 0; i<totalNumber; i++) {
    var currentDataItem = data[i];
    currentDataItem.set("ShowSubmitted", "true");
}

更新

// here all filtered/sorted data as in grid.
var view = dataSource.view();

Here 你可以阅读 kendo 关于 datasource 对象的文档

更新2 从分页数据源获取所有数据的解决方案：

var dataSource = $("#grid").data("kendoGrid").dataSource;
var filters = dataSource.filter();
var allData = dataSource.data();
var query = new kendo.data.Query(allData);
var data = query.filter(filters).data;

如何选中 Telerik Kendo Grid 中的所有复选框

How to check all check boxes in Telerik Kendo Grid

checkbox

kendo-ui

kendo-grid

kendo-asp.net-mvc