如何在剑道树视图上展开选定子节点的父节点

Question

你好剑道爱好者..我在剑道树视图上有一个小问题，如果它是父节点，我设法扩展树视图的选定子节点，但我可以扩展它的祖父节点，这是我的小代码：

data.forEach(function (entry) {
                        var treeView = $("#sysfunc_ktreeview").data('kendoTreeView');
                        var dataSource = treeView.dataSource;
                        var dataItem = dataSource.get(entry);
                        var node = treeView.findByUid(dataItem.uid);
                        var checkbox = $("input[type='checkbox']", node)[0];
                        checkbox.click();
                    });

在这种情况下，我从数据库中获取数组。但是在这里，如果检查了子节点但没有在数组中的 id（父节点），我无法扩展父节点。任何伟大的帮助将不胜感激。这段小代码来自 OnaBai 先生。谢谢先生

Answer 1

如果要单击id 在data 中的所有项目的祖先，请添加以下代码行：

var ancestors = $(node).parents("li[role='treeitem']");
$(">div>span>input", ancestors).click();

这会选择当前节点的所有祖先clicksinput。

所以你的代码应该是这样的：

  data.forEach(function (entry) {
      var treeView = $("#treeview").data('kendoTreeView');
      var dataSource = treeView.dataSource;
      var dataItem = dataSource.get(entry);
      var node = treeView.findByUid(dataItem.uid);
      var checkbox = $("input[type='checkbox']", node)[0];
      checkbox.click();
      var ancestors = $(node).parents("li[role='treeitem']");
      $(">div>span>input", ancestors).click();
  });

你可以看到它在这里运行：http://dojo.telerik.com/@OnaBai/IRom

Answer 2

我想出的最佳解决方案是：

高亮代码：

dataBound: function(e){
    // expands tree to the selected node
    var root = e.node ? $(e.node) : this.element;
    // expands only selected checkboxes and parents 
    this.expand(root.find(".k-item input[type=checkbox]:checked").parents());
},

完整代码：

$(".locationTree").kendoTreeView({
    loadOnDemand: false,
    checkboxes: true,
    select: function(e){
        e.preventDefault();
    },
    dataSource: {
        type: "json",
        data: processTable(flatData, "id", "parent", 0)
    },
    dataBound: function(e){
        // expands tree to the selected node
        var root = e.node ? $(e.node) : this.element;
        //this.expand(root.find(".k-item")); // expands all
        // expands only selected checkboxes and parents 
        this.expand(root.find(".k-item input[type=checkbox]:checked").parents());
    },
});

Answer 3

@OnaBai 先生找到了更好的方法

success: function (data) {
        $.each(data, function (index, entry) {

                        var dataSource = treeView.dataSource;
                        var dataItem = dataSource.get(entry);

                        if (!dataItem.hasChildren)
                        {
                            dataItem.set("checked", true);
                        }
                        var node = treeView.findByUid(dataItem.uid);

                        parents.push(treeView.dataItem(treeView.parent(node)).id);

                        if (index + 1 == data.length) {
                            setTimeout(function () {
                                self.expandParents(parents, treeView);
                            }, 100);
                        }                         
                    });
                    setTimeout(function () {
                        self.filterChange(treeView, data);
                    }, 100);
                }