使用 Kendo Grid 内联创建新记录如何更新新记录的密钥 ID？答案

【问题标题】：Using a Kendo Grid to create a new record inline how do I update the Key ID for the new record?使用 Kendo Grid 内联创建新记录如何更新新记录的密钥 ID？
【发布时间】：2012-09-21 17:51:19
【问题描述】：

在我的 Kendo Grid 中，我有默认的“添加新记录”按钮，并且我将其设置为可内联编辑。我设法将记录插入到数据库中，但是当用户对这条新记录进行更新时，它丢失了 ID。

我的代码如下：

var dataSource = new kendo.data.DataSource(
{
    transport: {
        read: {
            url: '/Reports/Manage/Reports'
        },
        create: {
            url: function (options) {
                debugger;
                // Ajax call to create a new record in the database
                $.ajax(
                    {
                        type: 'POST',
                        url: '/Reports/Manage/CreateNewReport',
                        data: { name: options.name },
                        success: function (response) {

我必须在这里做点什么吗？？？

                            return;
                        },
                        error: function (repsonse) {
                            alert("Manage: CreateNewReport -> Ajax Error!");
                        }
                    });
                return;
            },
            dataType: "json"
        },
        update: {
            url: function (options) {
                // Ajax call to update the Report Name in the database.
                $.ajax(
                    {
                        type: 'POST',
                        url: '/Reports/Manage/UpdateReportName',
                        data: { reportId: options.reportId, name: options.name },
                        success: function (response) {
                            // do nothing
                            // alert("Successfully Saved Note.");
                        },
                        error: function (repsonse) {
                            alert("Manage: UpdateReportName -> Ajax Error!");
                        }
                    });
                return;
            },
            dataType: "json"
        }
    },
    pageSize: 15,
    height: 500,
    data: reports,
    schema:
    {
        model:
        {
            id: 'reportId',
            fields:
            {
                name: { editable: true, validation: { required: true } },
            }
        }
    }
});


$reports.kendoGrid(
{
    dataSource: dataSource,
    pageable: {
        refresh: true,
        pageSizes: true
    },
    toolbar: ["create"],
    columns:
    [
        { field: 'name', title: 'Report', sortable: true },
        { command: ["edit", "destroy"], title: "&nbsp;", width: "180px", }
    ],
    editable: "inline",
    selectable: true,
    change: function (e) {
        // A new report was selected.
        ...
    }
});

【问题讨论】：

标签： c# jquery asp.net-mvc grid kendo-ui

【解决方案1】：

您应该从服务器返回新创建项目的 ID。在此处查看服务器响应：http://demos.kendoui.com/web/grid/editing-inline.html

您还应该使用内置传输配置。如果您像这样劫持 url 函数，DataSource 不会知道服务器响应。这就是我的意思：

transport: {
   create: {
      url: "/Reports/Manage/CreateNewReport",
      type: "POST"
   },
   parameterMap: function(options, type) {
      if (type == "create") {
          return {
             reportId: options.reportId, 
             name: options.name
          };
      }
      return options;
   }
}

有几个完整的例子展示了如何实现 CRUD：

【讨论】：

Atanas - 我试图放入 parameterMap 但它不适合我。我休息了一下，options.reportId 为空。这是我的问题。因此，当我对新添加的值进行更新时，它会创建第二条记录，而不是更新现有的记录。
您是否将您的 url 更改为字符串而不是函数？这是 parameterMap 工作所必需的。应该使 url 成为仅返回动态构建的 url 的函数。
我必须有一个函数，因为我在创建时正在做一些 ajax 调用。
不支持这个。正如我所说，仅当您想创建自定义 url 字符串时，才应将 url 设置为函数。不支持发出 ajax 请求，因为数据源永远不会在内部更新。在旁注中，我粘贴的代码也会发出 ajax 请求。你试过了吗？