Question

我正在尝试扩展所有群组。这是我的code sample

但似乎kendoTreeList只支持扩展第一组。我也在expand方法中尝试了以下选择器。

treeList.expand（$（ “K-树形列表的基团。”））;扩大所有群体。即使选择器$（“。k-treelist-group”）。长度为3（组的总数），但树形图只扩展第一组。

任何建议请告诉我。

Answer 1

你是对的，根据their site上的信息，它会扩展行，而不是行。

然后你可以迭代以获得相同的效果：

var treeList = $("#treeList").data("kendoTreeList");
var rows = $("tr.k-treelist-group", treeList.tbody);
$.each(rows, function(idx, row) {
    treeList.expand(row);
});

$(document).ready(function() {
  $("#treeList").kendoTreeList({
    columns: [ "id", "name" ],
    loadOnDemand:false,
    dataSource: [
      { id: 1, parentId: null, name: "Group", age: 30 },
      { id: 2, parentId: 1, name: "John Doe", age: 33 },
      { id: 3, parentId: 1, name: "Johson", age: 33 },

      { id: 4, parentId: null, name: "Group 2", age: 30 },
      { id: 5, parentId: 4, name: "Doe ", age: 33 },
      { id: 6, parentId: 4, name: "Noomi", age: 33 },

      { id: 7, parentId: null, name: "Group 3", age: 30 },
      { id:8, parentId: 7, name: "Doe ", age: 33 },
      { id: 9, parentId: 7, name: "Noomi", age: 33 }

    ]
  });
  var treeList = $("#treeList").data("kendoTreeList");
  var rows = $("tr.k-treelist-group", treeList.tbody);
  $.each(rows, function(idx, row) {
    treeList.expand(row);
  });
});

<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1119/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1119/styles/kendo.default.min.css">

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.3.1119/js/kendo.all.min.js"></script>

<div id="treeList"></div>

Answer 2

如果展开很多行可能会遇到一些性能问题，那么循环.expand方法的另一种方法是修改数据并再次绑定它。

var treeList = $("#treeList").data("kendoTreeList");
var dataItems = treeList.dataSource.data();

$.each(dataItems, function(i, item) {
    item.expanded = true;
});

treeList.dataSource.data(dataItems);

您也可以在绑定之前修改数据。

dataSource: {
        data: [
        { id: 1, parentId: null, name: "Group", age: 30 },
        { id: 2, parentId: 1, name: "John Doe", age: 33 },
        { id: 3, parentId: 1, name: "Johson", age: 33 },

        { id: 4, parentId: null, name: "Group 2", age: 30 },
        { id: 5, parentId: 4, name: "Doe ", age: 33 },
        { id: 6, parentId: 4, name: "Noomi", age: 33 },

        { id: 7, parentId: null, name: "Group 3", age: 30 },
        { id:8, parentId: 7, name: "Doe ", age: 33 },
        { id: 9, parentId: 7, name: "Noomi", age: 33 }          
        ],
      schema: {
        parse: function(data) {
          $.each(data, function(i, item) {
            item.expanded = true;
          });
          return data;
        }
      }
    }

展开/折叠所有gof kendoTreeList

2 个答案: