Kendo UI 在运行时添加行（客户端）答案

【问题标题】：Kendo UI adding row at Runtime(Client Side)Kendo UI 在运行时添加行（客户端）
【发布时间】：2013-08-22 09:06:40
【问题描述】：

我可以在运行时使用 .js 文件将一行添加到 Kendo 数据源中，但我没有从表单（UI）中看到，我按照以下步骤操作

var vgrid = $("#grdEntitys").data("kendoGrid");
var datasource = vgrid.dataSource;
var newRecord = { No: "8164",ModellNo: "147",ID: "Test01", Name: "TEST"}
datasource.insert(newRecord);

然后它抛出一个错误“TypeError：无法读取未定义的属性'AttributeValue'”，如果我们查看控制台日志，我可以看到增加的行数以及新插入的记录。但在 UI 中没有变化（UI Grid）。

能否请任何人告诉我，如何在客户端添加行？

提前致谢

【问题讨论】：

您的问题解决了吗？

标签： grid kendo-ui

【解决方案1】：

对于插入，您必须指定索引 (Insert)：

var dataItem = dataSource.insert(0, { name: "John Doe" });

您也可以使用Add，而不必指定索引：

<script>
var dataSource= new kendo.data.DataSource({
  data: [
    { name: "Jane Doe", age: 30 }
  ]
});
dataSource.add({ name: "John Doe", age: 33 });

【讨论】：

我正在尝试将一些行从我的弹出窗口网格带到主页网格。我尝试按如下方式选择一行： var grid = $("#ListOfValueWindowGrid2").data("kendoGrid");var selectedItem = (grid.dataItem(grid.select()));现在我需要将此行绑定到主页上的那个网格。我可以通过 $("#PunishmentGrid").data("kendoGrid").dataSource.data(obj);但问题是当我从弹出网格中选择另一行时，它会替换前一行。我也尝试了添加或插入方法。但是现在运气好，你能给我任何线索吗？

【解决方案2】：

您可以使用事件中的脚本在网格中添加项目。

var dataSource = $("#CustomerPackageChannelKendoGridAdd").data("kendoGrid").dataSource;  
           // Get value from another field  
     var _JV_ACCOUNT_ID = $('#JV_ACCOUNT_ID').val();  
     var _JV_ACCOUNT_NAME = $('#JV_ACCOUNT_NAME').val();  
     var _JV_ACCOUNT_CODE = $('#JV_ACCOUNT_CODE').val();  
     var _JV_NOTES = $('#JV_NOTES').val();  
     var _JV_DATE = $('#JV_DATE').val();  
     var type = $('#JV_Transaction_TYPE').val();  
    // You can set condition if required for you  
     if (CheckExistingData(gridDataAdd, _JV_ACCOUNT_ID) == false) {  
       currentId += 1;  
       dataSource.add(  
         {  
            id: currentId,  
            JV_ACCOUNT_ID: _JV_ACCOUNT_ID,  
            JV_ACCOUNT_NAME: _JV_ACCOUNT_NAME  
           , JV_ACCOUNT_CODE: _JV_ACCOUNT_CODE  
           , JV_NOTES: _JV_NOTES  
           , JV_DATE: _JV_DATE  
           , JV_DEBIT_AMOUNT: _JV_DEBIT_AMOUNT  
           , JV_CREDIT_AMOUNT: _JV_CREDIT_AMOUNT  
         });  
     }

更多你也可以see this:

【讨论】：