手动更改数据源中的数据项

Question

我有以下数据源，数据设置为一个数组。

var dataArray = [
    { Id: 1, Name: "RootA", ParentId: null },
    { Id: 2, Name: "ChildA", ParentId: 1 },
    { Id: 3, Name: "RootB", ParentId: null },
    { Id: 4, Name: "ChildB", ParentId: 3 },
    { Id: 5, Name: "RootC", ParentId: null }
];

var treeListDataSource = new kendo.data.TreeListDataSource({
    data: dataArray,
    schema: {
        model: {
            id: "Id",
            fields: {
                parentId: { field: "ParentId", type: "number", nullable: true },
                Id: { field: "Id", type: "number" }
            }
        }
    }
});

这有效。

现在我想将 dataArray 中的项目更改为：

var newData = [
    { Id: 6, Name: "RootD", ParentId: null },
    { Id: 7, Name: "ChildD", ParentId: 6 },
    { Id: 8, Name: "RootE", ParentId: null }
];

我试过了：

只是设置它：dataArray = newData;
通过 kendo 数据源中的 data() 方法设置：treeListDataSource.data(newData)

但是网格不显示新值。相反只是说 "no records".

这是一个demo。

Answer 1

我认为 parentId 字段在启动后不会查找修改后的字段 ParentId 是某种错误。您可以通过重新创建整个 datasource 定义来解决此问题。

你的代码应该是这样的：

<kendo-treelist id="treelist" k-options="treelistOptions"></kendo-treelist>

$scope.change = function() {
  var treelist = $("#treelist").data().kendoTreeList;
  var newData = [
    { Id: 6, Name: "RootD", ParentId: null },
    { Id: 7, Name: "ChildD", ParentId: 6 },
    { Id: 8, Name: "RootE", ParentId: null }
  ];
  var newDs = new kendo.data.TreeListDataSource({
    data: newData,
    schema: {
      model: {
        id: "Id",
        fields: {
          parentId: { field: "ParentId",  nullable: true },
          Id: { field: "Id", type: "number" }
        }
      }
    }
  });
  treelist.setDataSource(newDs);
};

Answer 2

我设法使用 transport API 让它工作。 http://dojo.telerik.com/OBUSU/4

var treeListDataSource = new kendo.data.TreeListDataSource({
    transport: {
        read: function (options) {
          var data = dataArray;
          options.success(data);
        }
    },
    ...
});

function change() {
    var newData = [
        { Id: 6, Name: "RootD", ParentId: null },
        { Id: 7, Name: "ChildD", ParentId: 6 },
        { Id: 8, Name: "RootE", ParentId: null }
    ];
    dataArray = newData;
    treeListDataSource.read();
};

手动更改数据源中的数据项

Manually change data items in datasource

javascript

kendo-ui

kendo-datasource