Filtering

Demo

Source code for this demo

Intro

Filtering on the tree will ensure that if a node is visible, then all its ancestors are also visible.
This is being taken care of by the treeModel 'filterNodes' function.

Filter by function

The function receives the node and returns true if the node should be hidden, false otherwise.

JavaScript

tree.treeModel.filterNodes((node) => {
  return !node.data.name.startsWith(text);
});

Filter by string

The function filters all nodes whose displayField ('name' by default) contains the given string. The comparison is done case insensitive.

JavaScript

tree.treeModel.filterNodes("text", true);

Note the second field - true by default.
This flag makes sure all nodes are visible after searching (i.e. expand all relevant ancestors).

Filtering by API

You can traverse the tree and do your own magic, and call hide(), show(), or setIsHidden(value) on all nodes as you wish.

Filtering by 2-way binding

You can bind to the tree state and supply a dictionary of hidden node IDs.
See 2-way binding to state for more information.