Question

我正在使用Kendo UI 2013.2.716和JQuery 2.0.3，我在页面上放置grid，我的问题是：

有谁知道如何告诉网格中destroy命令销毁了什么？

例如：

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <link href="kendo.common.min.css" rel="stylesheet" />
    <link href="kendo.default.min.css" rel="stylesheet" />
    <script type="text/javascript" src="jquery-2.0.3.min.js"></script>
    <script type="text/javascript" src="kendo.all.min.js"></script>
</head>
<body>            
<div id="grid"></div>
<script type="text/javascript">
    $(document).ready(function() {    
        var products = [];
        for(var i = 1; i <= 40; i++) {
            products.push({
                ProductId: i,
                ProductName: "Product " + i
            });
        }    
        $("#grid").kendoGrid({
            dataSource: {
                data: products,
                schema: {
                    model: {
                        id: "ProductId",
                        fields: {
                            ProductName: { type: "string" },
                        }
                    }
                },
                requestEnd: function (e) {
                    if (e.type === "destroy") {
                        alert("OK, so something got destroyed, but what??");
                    }
                }
            },
            editable: "inline",
            columns: [
                "ProductName",
                { command: "destroy", title: " ", width: "100px" }
            ]
        });
    });
</script>
</body>
</html>

我在documentation中找到了requestEnd回调，但我完全知道要知道被摧毁的物品在哪里。我只需要项目的ID，以便我可以适当地更新我的页面的其他部分。

我想知道我是否需要事先以某种方式捕获它。

Answer 1

您需要在数据源上配置transport对象。在您当前的配置中，是否真的会被破坏？当然，该项目可能会从您的网格中消失，但我想知道它是否仍然存在于数据源中。也许这就是你想要的。

http://docs.kendoui.com/api/framework/datasource#configuration-transport.destroy

如果您只是想找到一种方法来获取被销毁的数据，请挂钩parameterMap()对象的transport函数。在那里，您可以在执行操作之前操纵要删除的对象。

http://docs.kendoui.com/api/framework/datasource#configuration-transport.parameterMap

Answer 2

感谢@Brett指出传输上的destroy属性。这段代码可以解决问题 - 允许我捕获被销毁的东西（参见transport.destroy部分）：

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <link href="kendo.common.min.css" rel="stylesheet" />
    <link href="kendo.default.min.css" rel="stylesheet" />
    <script type="text/javascript" src="jquery-2.0.3.min.js"></script>
    <script type="text/javascript" src="kendo.all.min.js"></script>
</head>
<body>            
<div id="grid"></div>
<script type="text/javascript">
    $(document).ready(function() {    
        $("#grid").kendoGrid({
            dataSource: {
                schema: {
                    model: {
                        id: "ProductId",
                        fields: {
                            ProductName: { type: "string" },
                        }
                    }
                },
                transport: {
                    read: function (options) {
                        var products = [];
                        for(var i = 1; i <= 40; i++) {
                            products.push({
                                ProductId: i,
                                ProductName: "Product " + i
                            });
                        }    
                        options.success(products);
                    },
                    destroy: function (options) {                        
                        var data = $("#grid")
                            .data("kendoGrid").dataSource.data();
                        var products = [];
                        for(var i = 0; i < data.length; i++) {
                            if (data[i].ProductId !== options.data.ProductId) {
                                products.push(data[i])
                            }
                        }
                        options.success(products);

                        alert("Woo hoo - the product with the ID: " 
                            + options.data.ProductId + " was destroyed!");
                    }
                }
            },
            editable: "inline",
            columns: [
                "ProductName",
                { command: "destroy", title: " ", width: "100px" }
            ]
        });
    });
</script>
</body>
</html>

如何在kendo UI网格中告诉destroy命令销毁了什么？

2 个答案: