Question

我正在使用带有ASP.NET Web API的Kendo UI。有一个ProjectsController，它具有所有必要的方法。

我的问题是，当我点击Delete按钮时，Kendo UI网格会引发remove()事件，但DataSource从不调用transport.destroy。相反，似乎正在调用tansport.create。在transport.parameterMap我可以看到该操作是创建而不是销毁。

以下是JavaScript代码示例：

$(document).ready(function () {
    var apiUrl = '/api/projects/';
    var dataType = 'json';

    var dataSource = new kendo.data.DataSource({
        batch: true,
        autoSync: false,
        transport: {
            read: {
                url: apiUrl,
                dataType: dataType,
                type: "GET"
            },
            update: {
                url: apiUrl,
                dataType: dataType,
                type: "PUT"
            },
            destroy: {
                url: apiUrl,
                type: "DELETE"
            },
            create: {
                url: apiUrl,
                contentType: "application/json;charset=utf-8",
                dataType: dataType,
                type: "POST"
            },
            parameterMap: function (data, operation) {
                console.log("Operation: " + operation);
                if (operation === "create" && data.models) {
                    for (var i in data.models) {
                        var model = data.models[i];

                        if (model.ProjectId === 0) {
                            return kendo.stringify(model);
                        }
                    }
                } else if (operation === "destroy") {
                    console.log("Data.Models: " + data.models);
                    console.log("Data.id: " + data.ProjectId);
                    return { id: data.ProjectId };
                }

                return data;
            }
        },
        schema: {
            id: "ProjectId",
            model: {
                fields: {
                    ProjectId: { type: "number", editable: false, nullable: false, defaultValue: 0 },
                    ProjectName: { type: "string", validation: { required: true } },
                    Status: { type: "string", validation: { required: true } },
                    IsActive: { type: "boolean" }
                }
            }
        },
        pageSize: 10,
        serverPaging: false,
        serverFiltering: false,
        serverSorting: false
    });

    $("#projectsGrid").kendoGrid({
        dataSource: dataSource,
        groupable: false,
        sortable: true,
        pageable: {
            refresh: true,
            pageSizes: true
        },
        pageSize: 10,
        toolbar: ["create"],
        editable: "popup",
        columns: [
            { field: "ProjectId", width: 30, title: "ID" },
            { field: "ProjectName", width: 180, title: "Project" },
            { field: "Status", width: 90, title: "Status" },
            { field: "IsActive", width: 40, title: "Is Active", type: "boolean", template: '<input type="checkbox" #if (IsActive) {# checked="checked" #}# disabled="disabled" />' },
            { command: ["edit", "destroy"], title: "&nbsp", width: "80px" }
        ],

        remove: function (e) {
            console.log("Delete button clicked.");
            console.log("Project ID: " + e.model.ProjectId);
            //dataSource.remove(e.model);
            //dataSource.sync();
        }
    });
});

通过Fiddler发出请求时，Web API工作正常，但Kendo UI Grid显示：

POST http://localhost:port/api/Projects

应该是DELETE。

提前感谢大家！

Answer 1

在您的数据源上，您将批次标志设置为true，这意味着数据源只有在您告知之后才会进行呼叫，例如调用sync（）。 http://docs.kendoui.com/api/framework/datasource#configuration-batch

以及

确保您已在模型中定义了ID，正如OnaBai在此处解释Why does the KendoUI Grid Transport Create event gets raised multiple times, and even when the action is Update?，您的ID在模型之外，应该在：

   model: {
        id: "ProductID",
        fields: {
            ProductID: { editable: false, nullable: true },
        }
    }

Answer 2

如果有人在id中定义了model，如上所述，但dataSource尚未触发transport.destroy，则配置可能会有所帮助：

editable: {
..
mode: "inline", //or "popup
...
}
//or
editable: "inline" //or "popup"

http://www.telerik.com/forums/transport-destroy-of-grid-editor-is-not-working

Kendo UI DataSource不会触发transport.destroy

2 个答案: