剑道网格行删除配置

Question

嗨我有一个Kendo网格与每行删除按钮。当我点击删除按钮时，它要求确认，如“删除？”到这里就没事了。现在，当我点击“是”或“现在”时，我想捕捉事件。

当我点击是想要显示一条消息。当我点击否，我想显示另一条消息。

如何在剑道中捕捉这些事件？

Answer 1

我不认为有可能捕捉到这些，销毁事件是内置的，并“按原样”工作。

然而，有click事件（http://docs.kendoui.com/api/web/grid#configuration-columns.command.click），您可以创建显示，你必须写一个确认对话框（可以如使用内置confirm()的JavaScript它并不十分好看的自定义命令，而是将工作现在），你可以完全控制它们触发的按钮和事件。

Answer 2

我同意UweB，没有办法如何捕捉这样的事件。理想情况下，使用KendoWindow自己执行删除对话，您将获得更多自由并看起来像页面UI。

尝试以下操作：http://jsfiddle.net/vojtiik/KZ6pj/8/

添加命令：

command: [{ 
      name: "delete", 
      text: "delete", 
      click: _handleDelete, 
      imageClass: "ui-icon ui-icon-close" 
     }], 

捕捉选择商品和控制传递给窗口：

function _handleDelete(event) { 
     dataitem = grid.dataItem($(event.currentTarget).closest("tr")); 
     kWindow.open(); 
    }; 

做你的东西，删除：

$('.yesbtn').click(function() { 
     console.log('My message'); 
     grid.dataSource.remove(dataitem); 
     kWindow.close(); 
    }); 

Answer 3

UweB是正确的，你不能挂钩到销毁事件。 Kendo UI代码库中有一个用于滚动您自己的删除确认的示例。

http://www.kendoui.com/code-library/web/grid/customize-the-delete-confirmation-dialog.aspx

链接的代码示例使用剑道窗口，并为您提供一种方法来处理click事件既肯定又否定。如果你只需要一个定制删除消息，这里的代码片段：

$("#grid").kendoGrid({ 
    columns: [ 
     { 
      command: [{ name: "edit" }, { 
       name: "Delete", imageClass: "k-icon k-i-close", click: function (e) { 
        e.preventDefault(); 
        var dataItem = this.dataItem($(e.target).closest("tr")); 
        if (confirm('Do you really want to delete my favorite record?')) { 
         var dataSource = $("#grid").data("kendoGrid").dataSource; 
         dataSource.remove(dataItem); 
         dataSource.sync(); 
        } 
       } 
      }], title: " ", width: "200px" 
     } 
    ] 
}); 

Answer 4

我试过上述所有例子都是不能够解决这个问题。 它很简单

//Add this line of code to the grid 
    columns.Command(command => command.Custom("Remove").Click("removeItem")); 
    //Java script function to remove 
     function removeItem(e) { 
     //Get the instance of the grid 
     var grid = $("#grid").data("kendoGrid"); 
     //Get the selected grid 
     var tr = $(e.target).closest("tr"); 
     //Get the item from the grid 
     var data = this.dataItem(tr); 
     //Remove the item from the datasource 
     grid.dataSource.remove(data); 
     //Sync it with the grid 
     dataSource.sync(); 
    }