Kendo Grid：如何使数据源触发更新和创建事件

Question

我开始研究如何通过数据源将网格编辑返回到服务。

根据文档，我将本地测试数据源设置如下。

function getDataSource() {
var gridData = [
{
  col1: new CellData('1', 'data1-1'),
  col2: new CellData('2', 'data1-2')
  },
{
  col1: new CellData('3', 'data2-1'),
  col2: new CellData('4', 'data2-2')
  },
];

var dataSrc = new kendo.data.DataSource({
batch: true,

transport: {
  read: function (e) {
    e.success(gridData);
  },

  update: function (e) {
    // batch is enabled
    var updateItems = e.data.models;

    // This is not called

    // on success
    e.success();
  },

  create: function (e) {
    e.success(e.data);
  },
  destroy: function (e) {
    e.success();
  }
 }
});

 return dataSrc;
}

我有一个工具栏设置（带有“保存更改”），并且这正在调用SaveChanges配置事件，但是，只是看不到我需要做些什么才能使以下事件发生。

1. 让数据源更新称为
2. 将网格标记为“脏”，以使已编辑单元格上的红色“已编辑”指示消失

我在“添加新记录”中遇到了同样的问题（尽管我无法在此处触发网格“ addRow”）

我这里有运行示例

任何帮助将不胜感激！

Answer 1

您需要指定数据源架构才能使其工作：

var dataSrc = new kendo.data.DataSource({
    batch: false, // true would mean transport functions get multipe models  in e.data 
    transport: {
        // ....
    },
    schema: {
        data: function (response) {
            return response;
        },
        model: {
            id: "id",
            fields: {
                id: {
                    editable: false,
                    defaultValue: 0 // 0 == new / unsaved row
                },
                col1: {
                    editable: true,
                    // new items would have that using default add button
                    defaultValue: {
                        id: 0,
                        CategoryName: ""
                    }, 
                    fields: { id: { editable: true }, display: { editable: true }
                },
                col2: {
                    editable: true,
                    fields: { id: { editable: true }, display: {  editable: true } }
                }
            }
        }
    }
});

另请注意：

• grid.saveChanges将同步DS，因此您无需在事件中进行任何操作
• 没有addRow事件。
• 默认的“创建”按钮将尝试添加一个空对象。 由于使用嵌套对象，因此需要自己添加行，以便可以初始化属性。 因此，您需要一个自定义按钮并手动绑定操作

（ 演示 ）