Question

以下是我尝试使用Kendo UI网格实现的方案：

通过jquery，restangular或其他任何内容检索一些持久化数据。
将网格绑定到数据。
编辑网格中的数据。
向网格添加新行。
单击“保存”按钮并将更新的数据发送回服务器。

根据我所读到的内容，当使用Kendo UI网格时，您必须包装为数据源提供的数组，以便网格更新原始模型。但是，当您执行此操作时，网格的内置命令似乎无法正常运行。如以下示例所示，单击行上的“编辑”后，您无法单击“更新”或“取消”。它只是卡住了。如果不用数组包装它，现有记录可以很好地更新，但是你不会将新记录添加到原始数组中。

http://dojo.telerik.com/aTIba

错误行为似乎与通过使用ObservableArray包装它们将uid放在记录上这一事实有关。奇怪的是，传入一个空数组（就像你可能对Add vs and Edit对话框所做的那样），按钮正常工作，底层数据源被修改。

那么，这种配置有什么问题？

更新

原始示例将id字段显示为其中一列，这些列被证明是对我收到反馈的几个人的真实问题分心，所以我已将其删除。我还添加了添加新行和添加输出的功能，以查看原始数据源的内容。

Answer 1

如果取消包装ObservableArray并使用普通数组，它似乎可以工作。

  var sourceData = [
    { id:1, text: "Foo" },
    { id:2, text: "Bar" },
    { id:3, text: "Baz" }
  ];

自从我进入剑道内部以来已经有一段时间了，但是如果我没记错的话，当你将一个数组传递给new DataSource时，它会自动将数组包装成可观察的数据。

如果您使用上面显示的普通数组然后编辑表格中的字段，您可以使用window.sourceData[0].text

查看更改的对象

补充说明;由于您将DataSource的id设置为id属性，因此如果您在表中编辑该列，则会发生奇怪的事情。 ID应该是不可变的。例如，如果您使用id=1编辑第一行并将ID更改为3，那么Kendo DataSource将获取ID = 3（第3行）的项目并更改“Baz”中的文本到“Foo”。换句话说，Kendo通过查找其ID而不是通过跟踪数组中的索引来查找要更改的项目。

使用Kendo UI Grid实现双向绑定的预期方法是什么？

1 个答案: