1

我有以下代码删除选中的行（每行都有一个复选框，我在工具栏中有一个过滤器按钮（和其他按钮））。

var grid = $("#resultsGrid").data("kendoGrid");
grid.tbody.find("input:checked").closest("tr").each( function(index) {
    grid.removeRow($(this));
});

但是，当删除超过 20 行时，性能开始成为问题。但是，剑道过滤（删除）20 行或更多行的速度要快得多。剑道过滤如何从视图中删除多行？还是有其他更好的方法从网格中删除多行？在此先感谢您的帮助。

4

2 回答 2

4

** 将 Fiddle 更新到新位置 - 与之前相同的代码 **

尝试直接处理数据。将复选框连接到行的 ID 并对其进行过滤。

我链接了一个删除数组元素然后重新创建网格的小提琴。网格顶部的 2 个文本框捕获您要删除的 Id 范围（这将与您的 checkboxIds 的数组相同）。然后我循环浏览那些“删除 ID”，将它们从数据数组中删除并重新制作网格。

我稍微修改了以前的小提琴，这就是我重新创建网格而不是直接处理 DataSource 对象的原因。但我希望你能明白我在做什么。

在这个例子中我有 1000 条记录（只有 3 列），但它会很快删除 950 条记录。

Fiddle-从数据数组中删除

如果您需要 KendoUI DataSource 对象的示例，请告诉我。

我在下面包含了这段代码，因为没有它 StackOverflow 不会让我发帖。

function filterData() {

    var val1 = $("#val1").val();
    var val2 = $("#val2").val();

    var removeIndexes = new Array();

    for (var i = val1; i <= val2; i++) {
        removeIndexes.push(i);
    }    

    $(removeIndexes).each(function(removeIndex) {
        var removeItemId = this;
        $(randomData).each(function(dataIndex) {
            var continueLoop = true;
            if (this.Id == removeItemId) {
                randomData.splice(dataIndex, 1);
                continueLoop = false;
            }
            return continueLoop;
        });
    });

    createGrid();
}
于 2012-11-16T23:21:15.050 回答
1

您应该使用批量更新：

$("#resultsGrid").kendoGrid({
    dataSource: {
        batch: true,
        ...
    }, ...});

var grid = $("#resultsGrid").data("kendoGrid");
grid.tbody.find("input:checked").closest("tr").each( function() {
    var dataItem = grid.dataItem(this);
    grid.dataSource.remove(dataItem);
});
grid.dataSource.sync(); // this applies batched changes
于 2016-02-19T08:57:24.553 回答