Javascript 单击完成后，如何在剑道ui网格中捕获销毁事件？

我想在网格中删除按钮的单击事件完成时执行一个操作。我如何知道在Javascript中何时单击？

（最后阅读重要信息）

使用：

其中

#grid

是网格的id

如果要了解数据项，可以执行以下操作：

var item = $("#grid").data("kendoGrid").dataItem($(this).closest("tr"));

或者，您可以将

网格中的
命令
列

定义为：

{
    command: [
        "edit",
        {
            name : "destroy",
            text : "remove",
            click: myFunction
        }
    ],
    title  : "Commands",
    width  : "210px" 
}

{
    command: [
        "edit",
        {
            name     : "destroy",
            text     : "remove",
            className: "ob-delete"
        }
    ],
    title  : " ",
    width  : "210px"
}

其中

myFunction

为：

function myFunction(e) {
    alert("deleted pressed!");
    var item = $("#grid").data("kendoGrid").dataItem($(this).closest("tr"));
    // item contains the item corresponding to clicked row
}

重要提示：您可能希望定义自己的

销毁

按钮，其中仅从原始样式复制样式（无其他操作/检查）。如果是这样，请将

grid.columns.command

定义为：

{
    command: [
        "edit",
        {
            name : "destroy",
            text : "remove",
            click: myFunction
        }
    ],
    title  : "Commands",
    width  : "210px" 
}

{
    command: [
        "edit",
        {
            name     : "destroy",
            text     : "remove",
            className: "ob-delete"
        }
    ],
    title  : " ",
    width  : "210px"
}

然后定义：

$(document).on("click", "#grid tbody tr .ob-delete", function (e) {
    e.preventDefault();
    alert("deleted pressed!");
    var item = $("#grid").data("kendoGrid").dataItem($(this).closest("tr"));
    // item contains the item corresponding to clicked row
    ...
    // If I want to remove the row...
    $("#grid").data("kendoGrid").removeRow($(this).closest("tr"));
});

---

简单。您可以使用

remove:

捕获剑道中的销毁事件

$('#grid').kendoGrid({
        dataSource: gridDataSource,
        scrollable: true,
        sortable: true,
        toolbar: ['create'],
        columns: [
            { field: 'id', title: 'ID', width: 'auto' },
            { field: 'description', title: 'Description', width: 'auto' },
            { field: 'begin', title: 'Begin', width: 'auto', format: '{0:d}' },
            { command: ['edit', 'destroy'], title: ' ', width: '172px' }
        ],
        editable: {
            mode: 'inline',
            confirmation: false
        },
        save:function(e){
          alert("save event captured");
          //Do your logic here before save the record.
        },       
        remove:function(e){ 
          alert("delete event captured");
          //Do your logic here before delete the record.
        }
    });

$（文档）.ready（函数（）{
var gridDataSource=new kendo.data.DataSource({
数据：[
{id:1，描述：'Test 1'，begin:new Date（）}
],
模式：{
型号：{
id:'id'，
字段：{
id:{type:'number'}，
描述：{type:'string'}，
开始：{type:'date'}
}
}
}
});
$（“#网格”）.kendoGrid({
数据源：gridDataSource，
可滚动：对，
可排序：是的，
工具栏：[“创建”]，
栏目：[
{字段：'id'，标题：'id'，宽度：'auto'}，
{字段：'description'，标题：'description'，宽度：'auto'}，
{字段：“开始”，标题：“开始”，宽度：“自动”，格式：{0:d}，
{命令：['edit'，'destroy']，标题：''，宽度：'172px'}
],
可编辑：{
模式：“内联”，
确认：错误
},
保存：功能（e）{
警报（“保存捕获的事件”）；
},       
删除：功能（e）{
警报（“删除捕获的事件”）；
}
});
});

试验
单击事件完成后，如何获取数据库中要删除的行的数据？确实如此！您使用的是哪个版本的剑道UI？我使用的是v2012.3.1315。在
grid.columns
中，我有
{command:“destroy”，title:，width:“110px”}
，如果我添加您的代码：
[“edit”，{name:“destroy”，text:“remove”，click:myFunction}
它不起作用是的。这是一组按钮。在这个例子中，我放了一个编辑和一个销毁！这里（）使用v2012.3.1315和jQuery 1.83。我不得不改变
直播
活动的设置方式。此处（）与jQuery 1.72相同。如果需要恢复删除的行，请使用：$（“#grid”）.data（“kendoGrid”）.cancelChanges（）；