Question

我有一个KendoUI网格，对于某些列，您可以单击并从下拉列表菜单中选择一个值。

问题是，如果我在网格中添加一些新行并开始从任何给定列的下拉列表中选择选项，则选择速度似乎会呈指数级减慢。

E.g。如果我添加四行并为第一行中的列选择一些内容，速度就可以了。如果我然后从第二行中的一个下拉列表中选择一些东西，它会慢一些。然后，如果我选择第三行或第四行的东西，那就太慢了。

我检查了检查器中的所有内容，内存使用情况很好，并且没有巨大的ajax请求。在查看任务管理器时，我唯一看到的是CPU使用率达到100％，直到选择解冻。

这是我的一个下拉菜单（它们几乎完全相同）：

function conditionDropdown(container, options)
{
  $('<input required data-text-field="conditionName" data-value-field="conditionId" data-bind="value:' + options.field + '"/>')
  .appendTo(container)
  .kendoDropDownList({
    autoBind: false,
    dataSource: [{
      conditionName: "Used", 
      conditionId: 2
    }, {
      conditionName: "New", 
      conditionId: 1
    }]
  })
}

我的KendoUI网格：

$('#partsGrid').kendoGrid({
      dataSource: {
        data: partData,
        pageSize: 10,
        autoSync: true,
        schema: {
          model: {
            fields: {
              id: {
                type: "number",
                editable: false
              },
              quantity: {
                type: "number",
              },
              partNumber: {
                type: "string",
              },
              manufacturer: {
                type: "string",
              },
              partTypes: {
                defaultValue: {
                  partTypeId: 1, 
                  partType: "Unknown"
                }
              },
              jobTypes: {
                defaultValue: {
                  jobTypeId: 2, 
                  jobType: "Supply"
                }
              },
              conditions: {
                defaultValue: {
                  conditionId: 1, 
                  conditionName: "New"
                }
              },
              urgency: {
                defaultValue: {
                  urgencyId: 3, 
                  urgencyName: "Standard"
                }
              },
              leadtimes: {
                defaultValue: {
                  leadtimeId: 3, 
                  leadtimeName: "Standard"
                }
              }
            }
          }
        }
      },
      columns: [
      {
        field: 'quantity',
        width: 40,
        title: 'Qty',
      },
      {
        field: 'partNumber',
        width: 120,
        title: 'Part number',
        editor: partNumberScanner
      },
      {
        field: 'manufacturer',
        width: 120,
        title: 'Manufacturer',
      },
      {
        field: 'partTypes',
        width: 80,
        title: 'Part type',
        editor: partTypeDropdown,
        template: "#=partTypes.partType#"
      },
      {
        field: 'jobTypes',
        width: 80,
        title: 'Job type',
        editor: jobTypeDropdown,
        template: "#=jobTypes.jobType#"
      },
      {
        field: 'conditions',
        width: 70,
        title: 'Condition',
        editor: conditionDropdown,
        template: "#=conditions.conditionName#"
      },
      {
        field: 'urgency',
        width: 100,
        title: 'Urgency',
        editor: urgencyDropdown,
        template: "#=urgency.urgencyName#"
      },
      {
        field: 'leadtimes',
        width: 100,
        title: 'Lead time',
        editor: leadtimeDropdown,
        template: "#=leadtimes.leadtimeName#"
      }
      ],
      editable: {
        update: true,
        destroy: true,
        confirmation: false
      },
      toolbar: [
      {
        name: "create", 
        text: "Add part",
        className:"k-grid-insert-expense"
      }
      ]
    })
    $(".k-grid-insert-expense").bind("click", function (ev) {
      grid.addRow();
    });
    grid = $('#partsGrid').data("kendoGrid");

    grid.dataSource.bind("sync", function(e) {
      parts = grid.dataSource.data();
      partData = parts;
      grid.dataSource.success(parts);
    });

如果我在网格autoSync中将dataSource更改为false，则会解决所有速度问题，但这会破坏我想要的几种行为。

经过更多测试后，这条线似乎导致减速：

grid.dataSource.success(parts);

任何人都知道为什么？

选择时，带有下拉列表的KendoUI Grid会逐渐变慢

0 个答案: