如何从 Kendo UI Grid 中创建的过滤器中选择所有行？

Question

我有这个 Telerik 项目：https://dojo.telerik.com/@blockbaster/axIbuPOs

测试一下：

1. 在“库存单位”列中输入值“15”。

   --> 4 个元素应显示为超过 2 页的结果。

2. 点击左上角的“选择所有行”-复选框

   --> 只添加可见元素

The selected product ids are: [26, 7]

目标：执行第 1-2 点

The selected product ids are: [26, 48, 7, 70]

从网格导出到 Excel 时，有以下选项：

excel: {
  allPages: true
}

是否也有这样的选择？

注意：还没有服务器分页。所有数据将立即加载。

Answer 1

基本步骤是：

1. 将 Grid 的 persistSelection 配置设置为 true。
2. 使用 jQuery 选择器订阅主复选框的点击事件。

3. 在点击事件处理程序中

   3.1 使用 Kendo UI 数据源的 pageSize 方法将当前页面大小保存在一个全局变量中。

   3.2 使用 pageSize 方法显示单个页面上的所有行。

   3.3 使用 Kendo UI Grid 的 select 方法选择所有行。

   3.5 使用 pageSize 方法恢复旧页面大小。

   函数 onClick(e) { var grid = $("#grid").data("kendoGrid");

       oldPageSize = grid.dataSource.pageSize();
       grid.dataSource.pageSize(grid.dataSource.data().length);
   
       if (grid.dataSource.data().length === grid.select().length) {
           grid.clearSelection();
       } else {
           grid.select("tr");
       };
   
       grid.dataSource.pageSize(oldPageSize);
   };
   

Telerik 在文档here 中有一个跨网格页面选择的示例