kendo ui網格中的按鈕無法在移動設備上工作

Question

我舉個例子，kendo ui網格與Backbone.js一起添加。在kendo ui網格中，我有一個按鈕來刪除行，但這些按鈕不適用於移動設備。如果我反覆按下按鈕，它有時會起作用。爲什麼？ 我kendoGrid.columns聲明按鈕，以便：

{ 
command: [{ 
    name: "destroy", 
    text: "Remove", 
    className: "ob-delete" 
} 

要刪除行，做一些按鈕被點擊時：

$(document).on("click", ".grid tbody tr .ob-delete", function (e) { 
    var item = grid.dataItem($(this).closest("tr")); 
    var check = confirm("Delete"); 
    if (check) { 
     grid.removeRow($(this).closest("tr")); 
    } 
}); 

Full example

編輯：

我用kendo ui版本：2012.3.1114

Answer 1

移動和點擊事件不是最好的朋友！

在此代碼中，您將添加單擊具有.ob-delete類的Html元素，該類不會觸發Kendo的內置單擊事件。相反，嘗試實現您的刪除方法在這個演示顯示自定義命令：http://demos.kendoui.com/web/grid/custom-command.html

 $(document).ready(function() { 
       var grid = $("#grid").kendoGrid({ 
        dataSource: { 
         pageSize: 10, 
         data: createRandomData(50) 
        }, 
        pageable: true, 
        height: 260, 
        columns: [ 
         { field: "FirstName", title: "First Name" }, 
         { field: "LastName", title: "Last Name" }, 
         { field: "Title" }, 
         { command: { text: "View Details", click: showDetails }, title: " ", width: "140px" }] 
       }).data("kendoGrid"); 

       wnd = $("#details") 
        .kendoWindow({ 
         title: "Customer Details", 
         modal: true, 
         visible: false, 
         resizable: false, 
         width: 300 
        }).data("kendoWindow"); 

       detailsTemplate = kendo.template($("#template").html()); 
      }); 

      function showDetails(e) { 
       e.preventDefault(); 

       var dataItem = this.dataItem($(e.currentTarget).closest("tr")); 
       wnd.content(detailsTemplate(dataItem)); 
       wnd.center().open(); 
      } 
     </script> 

或者如果不需要自定義命令，嘗試如本演示默認刪除事件。 http://demos.kendoui.com/web/grid/editing-inline.html