無法刪除Kendo網格項目與淘汰賽

Question

我有一個Kendo網格與淘汰賽相結合。網格的最後一列包含一個用於刪除該行的按鈕。但removeItem方法的參數

this.removeItem = function (item) { 
     this.FilteredClients.remove(item); 
    }.bind(this); 

得到錯誤的值。

看http://jsfiddle.net/zeQMT/93/

缺少了什麼？

順便說一句。我不想使用行模板，因爲我想自己設置列標題。

Answer 1

如果您沒有使用行模板，那麼以這種方式綁定並不是無縫的。有一些非常簡單的方法，您可以處理單元格中按鈕的點擊，查找與該行相關聯的數據項，然後查找視圖模型項目。

例如，你可以綁定你列，如：

columns: [ 
       { field: "id", title: "id"}, 
       { field: "name", title: "name"}, 
       { command:[{text: "x", click: removeItem}]} 
      ] 

然後，你removeItem功能將需要找到像適當的視圖模型項目：

this.removeItem = function(e) { 
    var dataItem = this.dataItem($(e.currentTarget).closest("tr")); 
    if (dataItem && dataItem.id) { 
     self.items.remove(function(item) { 
      return item.id === dataItem.id; 
     }); 
    } 
}; 

樣品：http://jsfiddle.net/rniemeyer/EpkPy/

如果你想保持你的視圖模型代碼更清晰（避免引用事件/元素），那麼你可以附加一個處理程序來定位t他的項目，然後調用視圖模型。這將是我的首選。

喜歡的東西：

columns: [ 
       { field: "id", title: "id"}, 
       { field: "name", title: "name"}, 
       { command:[{text: "x", className: "btnRemove" }]} 
      ] 

然後，unobstrusively附加處理程序，如按鈕：

$("#myGrid").on("click", ".btnRemove", function(e) { 
    var widget = $("#selectedServices").data("kendoGrid"); 
    var dataItem = widget.dataItem($(e.currentTarget).closest("tr")); 
    if (dataItem && dataItem.id) { 
      vm.removeItem(dataItem.id); 
    } 
}); 

然後在你的虛擬機removeItem方法將只是採取在ID，如：

this.removeItem = function(id) { 
    self.items.remove(function(item) { 
     return item.id === id; 
    }); 
}; 

http://jsfiddle.net/rniemeyer/AwX5N/