Show the list of the parent nodes of a selected TreeView node.

Environment

Product Version	3.6.3
Product	Progress® Kendo UI for Vue Native

Description

This Knowledge base(KB) article shows how you can display the list of the parent nodes above the selected TreeView node. With the demonstrated approach you can get the 'path' from the root of the TreeView to the selected node.

KB sections

• Solution description
• Runnable example

Solution description

To get the path from the root element to the select node we are using the following method which is called every time a TreeView node is selected.

js

getParents(indexArray, index, tree) {
  if (tree[indexArray[index]]) {
    if (index + 1 !== indexArray.length) {
      this.currentPath += tree[indexArray[index]].text + ' > ';
    } else {
      this.currentPath += tree[indexArray[index]].text;
    }
  }

  if (index < indexArray.length && tree[indexArray[index]].items) {
    this.getParents(indexArray, index + 1, tree[indexArray[index]].items);
  }
},

Runnable example

Change Theme

Theme

Loading ...