Question

我一直面临以下情况的kendo网格问题。

我有一个18列的剑道网格。用户可以选择多行。行数大多超过10000。

要获取所选行，我使用的是grid.select()。要从行中提取内容，我使用grid.dataItem(row)。

以下是代码段。

            var listofselectedrows = grid.select();
            listofselectedrows.each(function (index, row) {
            var currentDataRow = grid.dataItem(row);
           });

每当所选行的数量更多时。用户界面变得反应迟钝。我调试了代码。 grid.dataItem(row)需要执行大量操作才能使网页无法响应。

请帮我解决这个问题。

此致

Answer 1

效果调整

绑定到大型数据集或使用大页面大小时，减少活动的内存中DOM对象对性能很重要。 Kendo Grid提供内置的UI虚拟化，可高度优化与大型数据集的绑定。通过简单的配置实现UI虚拟化。

$(document).ready(function(){
      $("#grid").kendoGrid({
         scrollable: {
             virtual: true
         }
      });
  });

Answer 2

使用分页：

$("#grid").kendoGrid({
    dataSource: {
        type: "odata",
        transport: {
            read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
        },       
        pageSize: 10,
        serverPaging: true        
    },
    height: 250,    
    pageable: true,
    selectable: "row multiple",
    columns: [
        "OrderID",
        "Freight",        
        "ShipName",                            
        "ShipCity"        
    ],   
});

Answer 3

如果我查看它们的源代码，dataItem函数使用正则表达式/k-grouping-row|k-detail-row|k-group-footer/循环遍历所有行元素以获取行索引。我相信使用数据源getByUid会比使用dataItem函数更快。

将您的代码更改为此

$.each(listofselectedrows, function (index, row) {
    var uid = $(row).data("uid");
    var currentData = grid.dataSource.getByUid(uid);
});

UI变得对kendo网格没有反应

3 个答案: