Articles in this section
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

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied