在kendo网格中添加/删除多个记录的有效方法

时间:2015-07-09 07:34:54

标签: javascript jquery kendo-ui kendo-grid

我需要添加/删除kendo网格中的多个记录。由于我的网格包含每行中的复选框以进行多选功能,因此我以自定义方式处理记录选择,以便检查网格行选择上的复选框。现在我遇到的问题是在一次添加多个记录时迭代记录。这会导致性能问题。以下是代码段。在下面的代码中,copySelectedToRemainingExtensionsGrid'和' copySelectedToIncludedExtensionsGrid'是按钮ID和包含的扩展名网格','#remainingExtensionsGrid'是kendo网格ID。

//Here I am creating button click events for moving records from one grid to another
    jQuery("#copySelectedToRemainingExtensionsGrid").on("click", function (e) {
              e.preventDefault();
              moveTo("#includedExtensionsGrid", "#remainingExtensionsGrid");
          });

//Here I am creating button click events for moving records from one grid to another    
          jQuery("#copySelectedToIncludedExtensionsGrid").on("click", function (e) {
              e.preventDefault();
              moveTo("#remainingExtensionsGrid", "#includedExtensionsGrid");
          });

//This method contains actual code for moving data from one grid to another
          function moveTo(from, to) {

        var fromGrid = jQuery(from).data("kendoGrid");
        var items = [];
        jQuery(from+" .k-grid-content tbody .k-state-selected").each(function () {
            items.push(fromGrid.dataItem(this));
        });

        var fromDS = fromGrid.dataSource;
        var toDS = jQuery(to).data("kendoGrid").dataSource;
        jQuery.each(items, function (idx, elem) {
              toDS.add({ id: elem.id, name: elem.name});
              fromDS.remove(elem);
        });

        checkGridHeaderCheckbox('#includedExtensionsGrid');
        checkGridHeaderCheckbox('#remainingExtensionsGrid');
      } 

1 个答案:

答案 0 :(得分:0)

获得要移动的所有数据后,您可以使用dataSource.pushCreate()dataSource.pushDestroy()进一步阅读link。这些方法可以添加/删除单个或多个项目到kendo数据源,单个:

dataSource.pushCreate({ id: 1, name: "John Doe" });

和多个:

dataSource.pushCreate([
    { id: 1, name: "John Doe" },
    { id: 2, name: "Jane Doe" }
]);