我正在使用Kendo树视图控件。在我的数据中,一些节点具有相同的父节点和子节点ID,但是每个节点中存在另一个属性“类型”,对于每个节点是不同的。我的数据有三个级别
以此示例为例
<div id="treeview"></div>
<script>
$("#treeview").kendoTreeView({
dataSource: [
{ id: 10, Type:1,text: "foo", items: [
{ id: 10, Type:2, text: "bar", items: [
{ id: 13, Type:3, text: "baz" }
] }
] }
]
});
var treeview = $("#treeview").data("kendoTreeView");
// expand the path of nodes with ID 10 and Type 2
treeview.expandPath([10]);
</script>
我想以编程方式选择Id 10和Type 2的节点。我的treeview配置为loadondemand设置为true(数据很大)。我只需要扩展Id和Type值并选择该特定节点。
当我尝试使用treeview数据源获取方法时,我得到第一个匹配项,在上面的例子中是id 10和Type 1.
“expandPath”方法需要从父级到子级的ID。
如何解决这个问题?
实际设置如下
var treeDataSource = new kendo.data.HierarchicalDataSource({
data: categoryDataSource,
schema: {
model: {
id: "Id",
children: "Children",
hasChildren(node) {
return (node.Children && node.Children.length > 0);
}
}
}
});
和使用这些选项的树视图
template: dropDownTreeViewTemplate,
dataSource: treeDataSource,
loadOnDemand: true,
dataTextField: "Name",
dataValueField: "Id",
select: function (e) {
// some code
}
答案 0 :(得分:3)
试试这个递归函数:
let expandNodeRecursive = function expandNodeRecursive(id, type, nodes)
{
let treeview = $("#treeview").data("kendoTreeView");
if (!nodes) {
nodes = treeview.dataSource.data();
}
var dataItem;
for (var i = 0, l = nodes.length; i < l; i++) {
dataItem = nodes[i];
if (dataItem.Type == type && dataItem.id == id) {
treeview.expandPath([dataItem.id]);
}
else if (dataItem.items && dataItem.items.length) {
expandNodeRecursive(id, type, dataItem.items);
}
};
};
// Call it without 'nodes' param
expandNodeRecursive(2, 10);