Kendo UI网格，问题保存新记录（AngularJS）

我有一个订单线网格与自定义编辑窗体，其字段预填充添加一行。我原本以为基于帮助我从这个问题收到此工作： How to populate add-row form programmatically for Kendo UI grid (AngularJS)Kendo UI网格，问题保存新记录（AngularJS）

然而，尽管它工作在简化plunker，有几个问题想实现它在一个真正的项目时。

这里是一个更新的plunker显示下面的问题： http://plnkr.co/edit/wtW4RzVu7uuhrJJbWvVd?p=preview

下面是相关HTML：

<div id="wrapper" class="container-fluid" ng-controller="ticketEntryController"> 
    <div ng-controller="ticketLineController"> 
     <div kendo-grid="ticketLineGrid" k-options="getTicketLineGridOptions()"></div> 
    </div> 
    <button id="addButton" ng-click="addRow()" class="btn btn-primary btn-sm">Add Row</button>

点击Add按钮按钮呼吁ticketEntryController $ scope.addRow ：

(function() { 
    'use strict'; 
    angular.module('app').controller('ticketEntryController', ticketEntryController); 

    function ticketEntryController($scope) { 
     $scope.lineGrid = {}; 

     $scope.addRow = function() { 
      var item = { 
      itemNo: "TEST 123", 
      id: 0, 
      itemDescr: "new item description", 
      cat: "CAM", 
      mfg: "ACME", 
      mfgPartNo: "ABC123456", 
      itmStat2: "N", 
      price: 133, 
      qty: 1 
      }; 
      var ticketId = 200; 
      $scope.$broadcast('AddRow', ticketId, item); 
     } 
    } 
})();

addRow（）以上广播到$范围在ticketLineController美元：

(function() { 
    'use strict'; 
    angular.module('app').controller('ticketLineController', ticketLineController); 

    function ticketLineController($scope) { 
     $scope.$on('AddRow', function(event, ticketId, item) { 
      console.log("ticketLineController, AddRow: " + item.itemNo); 

      $scope.ticketId = ticketId; 
      $scope.itemForAdd = item; 
      $scope.ticketLineGrid.addRow(); 
     }); 

     $scope.getTicketLineGridOptions = function() { 
      return { 
       dataSource: { 
        type: "json", 
        transport: { 
         read: function (options) { 
          console.log("--- read ---"); 
          options.success(ticketLines); 
         }, 
         create: function (options) { 
          console.log("--- create ---"); 
          ticketLines.push(options.data); 
          options.success(options.data); 
         }, 
         update: function (options) { // Why is it calling "update" for addRow?? 
          console.log("--- update ---"); 
          ticketLines.push(options.data); 
          options.success(options.data); 
         }, 
         destroy:function (options) { // Why is it calling "destroy" for addRow (issue 2)? 
          console.log("--- destroy ---"); 
         }, 
        }, 
        schema: { 
         model: { 
          id: "id", 
          fields: { 
           id: { type: "string" }, 
           orderId: { type: "number" }, 
           lineNo: { type: "number" }, 
           ... 
          }, 
         } 
        }, 
        sort: [{ field: "ItemNo", dir: "asc" }], 
        pageSize: 50 
       }, 
       ... 
       edit: function (e) { 
        if (e.model.isNew()) { 
         e.model.set("orderId", $scope.ticketId); 
         e.model.set("lineNo", 0); 
         e.model.set("id", $scope.ticketId + "_0"); 
         ... 
         e.model.set("qty", 1); 
        } 
        var popupWindow = e.container.getKendoWindow(); 
        e.container.find(".k-edit-form-container").width("auto"); 
        popupWindow.setOptions({ 
         width: 640 
        }); 
       },

问题＃1：当添加行，“更新”获取调用，而不是在网格的数据源“创造”。

问题2：取消了编辑表单后，下一次尝试后，“更新”添加一行时，它由于某种原因，所谓的“破坏”重现： 1）单击添加行 2）单击编辑表单取消 3）单击添加行再次 4）单击更新

来源

2014-09-05 Lars335

我认为这更像是KendoUi的“特色”，尽管我无法确定。根据文档创建事件应该被称为，但我没有看到它被称为。你看到更新后（取消后）调用destroy的原因很可能是因为正在调用sync命令并且正在“销毁”已添加（然后取消）的行。每次调用addRow时，API都会将新对象添加到“列表”中，即使您最终可能不会使用它（通过取消）。更新'ticketEntryController'中的'ticketId'，你会看到控制台发生了什么 – JoseM 2014-09-09 12:47:09

我听见从Telerik的这一背，“更新”是被调用，而不是“创造”的原因是，对于新记录，id字段必须为空（= 0表示整数，或者“”表示字符串id字段）。一旦我解决了这个问题，两个问题都解决了。

在相关说明中，从服务器POST（添加记录）返回的记录必须包含填充的ID字段，以便后续编辑在网格中调用“更新”而不是“创建”。

来源

2014-09-09 17:55:22 Lars335

我有完全相同的问题。实际上ID字段在我的数据库自动生成和发布是通过分配新创建的ID回视图模型如下简单地解决：

 dbContext.Shipping.Add(entity); 
     dbContext.SaveChanges(); 

     //int newID = entity.Id; 
     ShippingViewModel.Id = entity.Id;

希望这会有所帮助。

来源

2014-11-13 16:10:16 giparekh

Kendo UI网格，问题保存新记录（AngularJS）

回答

相关问题