剑道UI网格优化

Question

我有两个剑道网格命名：

var sourcegrid = $('#usersGrid').data("kendoGrid");        //SOURCE GRID
var destinationgrid = $('#teamGrid').data('kendoGrid');    //DESTINATION GRID

在 sourcegrid 中我有 1000 条记录，而在destinationgrid 中没有记录。

我有将数据从源网格传输到目标网格的按钮。

代码：

 sourcegrid.select().each(function () {
        var dataItem = sourcegrid.dataItem($(this));
        destinationgrid.dataSource.add(dataItem);
        sourcegrid.removeRow($(this));
    });

当我将 500 条记录传输到destinationgrid 时。转移的过程是这样的 慢的。任何优化它的想法。

谢谢

你可以编辑这个 http://jsfiddle.net/2qXKy/112/

Answer 1

这是我为您加快速度的尝试：

http://jsfiddle.net/5t5c2g1y/2/

var ds1 = new kendo.data.DataSource( {
    data: createRandomData(500),
    scrollable: true,
    schema: {
        model: {
            id: "id",
            fields: {
                id: {
                    type: 'number',
                    editable: true
                },
                FirstName: {
                    type: 'string',
                    editable: true
                },
                LastName: {
                    type: 'string',
                    editable: true
                }
            }
        }
    }
});

var ds2 = new kendo.data.DataSource({
    data: createRandomData(0),
    scrollable: true,
    schema: {
        model: {
            id: "id",
            fields: {
                id: {
                    type: 'number',
                    editable: true
                },
                FirstName: {
                    type: 'string',
                    editable: true
                },
                LastName: {
                    type: 'string',
                    editable: true
                }
            }
        }
    }
});

var sourcegrid = $("#usersGrid").kendoGrid({
    dataSource: ds1,
    editable: "popup",
    selectable: "multiple",
    pageable: false,
    columns: [{
        field: "FirstName",
        width: 90,
        title: "First Name"
    }, {
        field: "LastName",
        width: 90,
        title: "Last Name"
    }]
}).data("kendoGrid");

var destinationgrid = $("#teamGrid").kendoGrid({
    dataSource: ds2,
    editable: "popup",
    selectable: "multiple",
    pageable: false,
    columns: [{
        field: "FirstName",
        width: 90,
        title: "First Name"
    }, {
        field: "LastName",
        width: 90,
        title: "Last Name"
    }]
}).data("kendoGrid");


$('input[type=button]').on('click',function() {
    var removalList = []; 
    sourcegrid.select().each(function () {

        var dataItem = sourcegrid.dataItem($(this));
        console.log(dataItem);
        removalList.push(dataItem)
        ds2.add(dataItem);


    });

   for(var i = 0; i< removalList.length;i++)
   {
       ds1.remove(removalList[i]);
   }

});

如果您与数据源而不是网格本身进行交互，您希望看到该过程要快得多（加上摆脱要求您确认删除的弹出消息）

您会注意到我添加了一个控制台语句，以便您可以看到正在复制的信息。

再次希望这会有所帮助。