Category / Section
How to get all the node elements of a TreeView
1 min read
In the TreeView control, you can get the node details of all the tree nodes using the getTreeData method, excluding the node elements. This can be achieved using the querySelector method of jquery. The following code sample demonstrates this.
// To get all the tree nodes
$(".e-treeview")[0].querySelectorAll(".e-item")
Output
Sample: https://jsplayground.syncfusion.com/locu4gfg
If there are many TreeView’s in a single page, set the cssClass and use this class to get all the tree nodes of a particular TreeView.
//Treeview 1
$("#treeView1").ejTreeView({
fields: { id: "id", parentId: "pid", text: "name", hasChild: "hasChild", dataSource: localData, expanded: "expanded" },
//Adding css class to identify the treeview 1
cssClass: "treeview1"
});
//Treeview 2
$("#treeView2").ejTreeView({
fields: { id: "id", parentId: "pid", text: "name", hasChild: "hasChild", dataSource: treeData, expanded: "expanded" },
//Adding css class to identify the treeview 2
cssClass: "treeview2"
});
//To get all the tree nodes of Treeview 1
console.log($(".treeview1")[0].querySelectorAll(".e-item"));
//To get all the tree nodes of Treeview 2
console.log($(".treeview2")[0].querySelectorAll(".e-item"));
Output