Skip to main content

Tree View

  • 2 minutes to read
IMPORTANT

Bootstrap Controls for ASP.NET Core are in maintenance mode. We don’t add new controls or develop new functionality for this product line. Our recommendation is to use the ASP.NET Core Controls suite.

The Bootstrap Tree View is an easy and useful navigation control that allows you to represent hierarchical structure data as a tree.

With Bootstrap Tree View, you can manually create a tree or easily populate it with data by binding to hierarchical data sources. The Tree View control is highly customizable: you can change the appearance of almost any visual elements. With integrated template technology, you can easily transform nodes into anything you can imagine.

BootstrapTreeView_Overview

This topic lists the main features of the Tree View control.

Control Features

  • Tree View can be populated with node information taken from a data source containing hierarchical data.
  • Templates can be specified for two element types: node text content and the entire node content. You can apply templates for all identical elements within Tree View (using control level templates) or for a particular element (using node level templates).
NOTE

Online Demo: The Templates online demo describes how to customize Tree View with templates.

Client-Side Features

  • Client-side events allow you to respond to node clicks, the changing nodes checked state, and perform custom actions before and after nodes are expanded and collapsed.
  • You can use our client-side API to expand and collapse nodes, find nodes, obtain and change node state information, and also get and change the selected node.
NOTE

Online Demo: The Client-Side Events and Client-Side Functionality online demos show Bootstrap Tree View сlient-side features.

Node Features

  • You can prevent your end-users from expanding/collapsing individual nodes.
  • Tooltips can be assigned to individual nodes.
  • Node can display supplementary information within a badge.
See Also