Controls You Can Use on Web Forms ASP.NET Navigation Controls TreeView Control
The ASP.NET TreeView control is a full-featured navigation control that can display hierarchical data, such as a table of contents or file directory, in a tree structure.
The contents of a TreeView control can be set directly in the control, or by binding the control to a data source.
The content, behavior, and appearance of a TreeView control can all be decided at design time, using simple declarative syntax. The control, though, supports programmatic access to the TreeView object model, enabling developers to extend the control’s basic functionality, such as to create trees, populate nodes, set properties, and so on dynamically.
The following sections briefly introduce the main features of the TreeView control.
Basically, a TreeView control is made up of TreeNode objects that are arranged in one or more levels. TreeView levels are specified by nesting parent and child nodes in hierarchical or tree-like fashion.
Tree nodes at the top level ( level 0 ) are called root nodes. An individual root node can have one or more child nodes ( level 1 ), each of which can also be a parent to other child nodes ( level 2 ), and so on.
The following table describes the three different node types.
Node Type |
Description |
Root |
A node that has no parent node and has one or more child nodes. |
Parent |
A node that has a parent node and has one or more child nodes. |
Leaf |
A node that has a parent node but has no child nodes. |
Although a typical tree has only one root node, the TreeView control allows adding multiple root nodes to the tree structure. This is useful when displaying item listings with no single main root node, as in a list of product categories.
Each node has a Text property, which is what displays in the TreeView control.
The nodes for a TreeView control may be defined using any of the following ways:
- by adding individual TreeNode objects declaratively. For particulars, see Adding TreeView Nodes Declaratively.
- by programmatically creating new instances of the TreeNode class. For particulars, see Adding TreeView Nodes Programmatically.
- by binding the control to a data source. For particulars, see Binding a TreeView Control to a Data Source.
How a TreeView control responds when a user clicks a node depends on the following situations:
- If the NavigateUrl property of a node is set, the TreeView control navigates to the linked Web page.
By default, a linked page is displayed in the same window or frame as the TreeView control. To display the linked content in a different window or frame, use the Target property of the TreeView control.
NOTE: The Target property affects every node in the control. To specify a window or frame for an individual node, set the Target property of the TreeNode object directly.
- If the NavigateUrl property is not set, the TreeView control simply posts the page back to the server for processing.
In this case, clicking a node will raise a SelectedNodeChanged event that can be handled to provide custom functionality.
Each node also has a SelectAction property that can be used to determine specific actions that happen when the node is clicked, such as expand or collapse the node.
In addition, each node has a Value property, which can be used to store any additional data about the node, such as data passed to the postback event that is associated with the node.
Adding TreeView Nodes Declaratively Adding TreeView Nodes Programmatically