Category / Section
How to get the full node path on node click?
1 min read
The TreeView component contains options to get node data for specified tree node elements using the getNode method. This document explains how to use this method to get the full path for a node on click action. The following code demonstrates how to get the full path for a tree node on click action.
ANGULAR
public parentNodes: any = []; //Node Selected Event for TreeView component public onNodeSelected(args: NodeSelectEventArgs): void { this.parentNodes.push(args.node) this.findParentNodes(args.node); let fullpath = ""; for(let i = this.parentNodes.length - 1; i >= 0; --i) { //using getNode method to get the node text var data = this.tree.getNode(this.parentNodes[i]); fullpath = fullpath + data.text; if (i != 0) { fullpath = fullpath + '\\'; } } alert(fullpath); this.parentNodes = []; } //collect the parent nodes for currently selected node public findParentNodes(node: HTMLElement) { let parent: HTMLElement = node.parentElement.parentElement; if (parent.classList.contains("e-list-item")) { this.parentNodes.push(parent); this.findParentNodes(parent); } }
Sample: https://stackblitz.com/edit/angular-jtncp8?file=default.component.ts