Kendo Grid Child -> 使用 CRUD 工具栏

Question

我的问题是我有分层网格（主和子）假设我有一个部门网格，它包含员工网格列表，并且它们都使用相同的数据源。这是我的 GridChild 代码：

function detailInit (e){
    var msterRow =  e.sender.items().index(e.masterRow).toString();
    var grid = $("<div id='childGrid"+msterRow+"' 
              class=childGrid'/>").appendTo(e.detailCell).kendoGrid({
    data: e.data.DeptEmployees,
    schema: {
        model: {  fields: { foo: {--skip--}, bar: {--skip--} } }
    },
    toolbar: ["create", "cancel", "save"],
    editable: "popup",
    columns: [ --skip--]
    save: function(e){
        ajaxUpdateDepartment(msterRow, this.dataSource.data());
    }
})

如您所见，我使用 data: e.data.DeptEmployees, 作为子数据源来获取数据。现在我正在堆积如何更新子数据源？

What I have Tried:

I add child's dataSource.transport for updates, but my child grid keeps on loading.

So I end up configuring the save: function (e) and simply send all data source of the current child but popup editor didn't close at all. And I'm having difficulty to refresh the child data source.

I also attempt to convert my Master and Child Grid to ASP Razor but there was no definite example if how could I handle it in back end, and also my child grid contains drop down grid, so that would be a big re-do. And I also don't know if how can I pass customize parameter through it

我很绝望，除了this one我找不到任何工作参考。但它使用的是 odata，并且 我没有子 ID 用作参考，因为我只使用我在用户事件中检索的列表。

请帮忙:'(我花了太多时间来做这个。

Answer 1

解决方案是定义一个传输属性，为了从master获取数据，我只需要定义数据并将其转换为Jason。

看看这些代码：

function detailInit (e){
    var msterRow =  e.sender.items().index(e.masterRow).toString();
    var grid = $("<div id='childGrid"+msterRow+"' 
              class=childGrid'/>").appendTo(e.detailCell).kendoGrid({
    //data: e.data.ChildDetails,
    transport: {
         read: function (o) {
               console.log("child read");
               var data = e.data.ChildDetails.toJSON();
               o.success(data);
         },
         update: function (o) {
               console.log("child update");
               var data = o.data,
               arentItem = findByID(data.id);
               for (var field in data) {
                      if(!(field.indexOf("_") === 0)){
                           arentItem[field] = data[field];
                       }
                }
               e.data.dirty = true;
               saveChild(record, "@suffix", msterRow, "update");
               o.success();
          },
          destroy: function (o) {
               var parentItem = findByID(o.data.id);
               preventBinding = true;
               e.data.ChildDetails.results.remove(parentItem);
               o.success();
               saveChild(record, "@suffix", msterRow, "destroy");
          },
          create: function (o) {
                console.log("child create");
                var record = o.data;
                record.id = index;
                index++;
                saveChild(record, "@suffix", msterRow, "create");
                o.success(record);
           }
    },
    schema: {
        model: {  fields: { foo: {--skip--}, bar: {--skip--} } }
    },
    toolbar: ["create", "cancel", "save"],
    editable: "popup",
    columns: [ --skip--]
}

Here's the working dojo snippet

Kendo Grid Child -> 使用 CRUD 工具栏

Kendo Grid Child -> using CRUD toolbar

javascript

asp.net-mvc

kendo-grid