Kendo UI 数据源不触发 transport.destroy [英] Kendo UI DataSource not triggering transport.destroy

问题描述

我正在使用带有 ASP.NET Web API 的 Kendo UI.有一个包含所有必要方法的 ProjectsController.

I am using Kendo UI with ASP.NET Web API. There is a ProjectsController that has all the necessary methods.

我的问题是，当我点击 Delete 按钮时，Kendo UI 网格将引发 remove() 事件，但 DataSource 从不调用 <代码>transport.destroy.相反，似乎正在调用 tansport.create.在 transport.parameterMap 中我可以看到操作是 create 而不是 destroy.

My issue is that when I click on Delete button, Kendo UI grid will raise remove() event, but DataSource never invokes transport.destroy. Rather, it seems that tansport.create is being invoked. In transport.parameterMap I can see that the operation is create instead of destroy.

这是一个示例 JavaScript 代码:

Here is a sample JavaScript code:

$(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 显示:

Web API works fine when requests are issued via Fiddler, but Kendo UI Grid shows:

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

什么时候应该是DELETE.

提前谢谢大家！

推荐答案

在您的数据源上，您将 batch 标志设置为 true，这意味着数据源只有在您告诉它之后才会进行调用例如调用sync().http://docs.kendoui.c​​om/api/framework/datasource#configuration-批量

On your datasource, you have the batch flag set to true, this means the datasource will make the call only after you tell it to, e.g calling sync(). http://docs.kendoui.com/api/framework/datasource#configuration-batch

以及

确保您已在模型中定义了 Id，正如 OnaBai 在此处解释的那样 为什么 KendoUI Grid Transport Create 事件会被多次引发，甚至当操作是 Update 时? ，你的 id 在模型之外，应该在 :>

Make sure you have defined Id in the model, as OnaBai explained here Why does the KendoUI Grid Transport Create event gets raised multiple times, and even when the action is Update? , your id is outside the model, should be in :

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

这篇关于Kendo UI 数据源不触发 transport.destroy的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！