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）

回答

相關問題