javascript - Kendo UI Grid : if I make changes and save them, 之后我仍然可以取消它们。怎么把他们锁起来？

Question

我有一个绑定(bind)到本地数据源的 Kendo UI 网格。如果我进行一些更改并单击“保存更改”，然后单击“取消更改”，则更改将回滚。我预计他们会被“锁定”，因为我救了他们。

此外，如果我进行更改、保存、再进行更改、再次保存并最终取消，则这两个更改都会回滚。

请参阅更新的 fiddle ，其中包含问题和解决方案: http://jsfiddle.net/q24ennne/7/

我的 HTML:

<div id="grid"></div>

我的 JavaScript:

window.gridData = [
{ id: 1, text: "Uno" }, 
{ id: 2, text: "Dos" }, 
{ id: 3, text: "Tres" }, 
{ id: 14, text: "Catorce" }, 
];

(function() {
    $('#grid').kendoGrid({
      toolbar: ["save", "cancel"],
      editable: true,
      saveChanges: function(e) {
        gridData = $('#grid').getKendoGrid().dataSource.data();
        $('#grid').getKendoGrid().refresh();
        console.log("gridData:");
        console.log(gridData);
      },
      columns: [{
        field: "text",
        title: "No."
      }],
      dataSource: {
        data: gridData,
      }
    });
})();

谢谢!

Answer 1

您需要包含数据源的架构，指定哪个属性是每个项目的 ID。在您的情况下，这也称为“id”，因此添加以下内容:

dataSource: {
  data: gridData,
  schema: {
    model: { id: "id" }
  }
}

网格将正确跟踪并保留您保存的更改。