Bewerken

Share via


TreeNode Class

Definition

Represents a node in the TreeView control.

public ref class TreeNode : ICloneable, System::Web::UI::IStateManager
public class TreeNode : ICloneable, System.Web.UI.IStateManager
type TreeNode = class
    interface IStateManager
    interface ICloneable
Public Class TreeNode
Implements ICloneable, IStateManager
Inheritance
TreeNode
Implements

Examples

The following code example demonstrates how to set up the frames for the next code example.


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>TreeView Frameset Example</title>
</head>
         
    <frameset cols="30%, 75%">
   
        <frame title="MenuFrame" name="Menu" src="TreeViewFramecs.aspx"/>
        <frame title="ContentFrame" name="Content" src="Home.aspx"/> 
           
    </frameset>      
   
</html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>TreeView Frameset Example</title>
</head>
         
    <frameset cols="30%, 75%">
   
        <frame title="MenuFrame" name="Menu" src="TreeViewFramevb.aspx"/>
        <frame title="ContentFrame" name="Content" src="Home.aspx"/> 
           
    </frameset>      
   
</html>

The following code example demonstrates how to use declarative syntax to create TreeNode objects in the TreeView control. This example is used within the frameset of the previous example to display a table of contents.


<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
  <head runat="server">
    <title>TreeView Declarative Syntax Example</title>
</head>
<body>
    <form id="form1" runat="server">
    
      <h3>TreeView Declarative Syntax Example</h3>
      
      <asp:TreeView id="SampleTreeView" 
        runat="server">
         
        <Nodes>
        
          <asp:TreeNode Value="Home" 
            NavigateUrl="Home.aspx" 
            Text="Home"
            Target="Content" 
            Expanded="True">
             
            <asp:TreeNode Value="Page 1" 
              NavigateUrl="Page1.aspx" 
              Text="Page1"
              Target="Content">
               
              <asp:TreeNode Value="Section 1" 
                NavigateUrl="Section1.aspx" 
                Text="Section 1"
                Target="Content"/>
                 
            </asp:TreeNode>              
            
            <asp:TreeNode Value="Page 2" 
              NavigateUrl="Page2.aspx"
              Text="Page 2"
              Target="Content">
               
            </asp:TreeNode> 
            
          </asp:TreeNode>
        
        </Nodes>
        
      </asp:TreeView>

    </form>
  </body>
</html>

<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
  <head runat="server">
    <title>TreeView Declarative Syntax Example</title>
</head>
<body>
    <form id="form1" runat="server">
    
      <h3>TreeView Declarative Syntax Example</h3>
      
      <asp:TreeView id="SampleTreeView" 
        runat="server">
         
        <Nodes>
        
          <asp:TreeNode Value="Home" 
            NavigateUrl="Home.aspx" 
            Text="Home"
            Target="Content" 
            Expanded="True">
             
            <asp:TreeNode Value="Page 1" 
              NavigateUrl="Page1.aspx" 
              Text="Page1"
              Target="Content">
               
              <asp:TreeNode Value="Section 1" 
                NavigateUrl="Section1.aspx" 
                Text="Section 1"
                Target="Content"/>
                 
            </asp:TreeNode>              
            
            <asp:TreeNode Value="Page 2" 
              NavigateUrl="Page2.aspx"
              Text="Page 2"
              Target="Content">
               
            </asp:TreeNode> 
            
          </asp:TreeNode>
        
        </Nodes>
        
      </asp:TreeView>

    </form>
  </body>
</html>

Remarks

The TreeView control is made up of nodes. Each entry in the tree is called a node and is represented by a TreeNode object. A node that contains other nodes is called a parent node. A node that is contained by another node is called a child node. A node that has no child nodes is called a leaf node. A node that is not contained by any other node but is the ancestor to all the other nodes is the root node. A node can be both a parent and a child, but root, parent, and leaf nodes are mutually exclusive. Several visual and behavioral properties of nodes are determined by whether a node is a root, parent, or leaf node.

Although a typical tree has only one root node, the TreeView control allows you to add multiple root nodes to your tree structure. This is useful when you want to display item listings without displaying a single main root node, as in a list of product categories.

A node primarily stores data in two properties, the Text property and the Value property. The value of the Text property is displayed in the TreeView control, and the Value property is used to store any additional data about the node, such as data used for handling postback events. A node also stores the path from the node to its root node in the ValuePath property. The ValuePath property indicates the node's position relative to the root node.

Note

Nodes at the same level must each have a unique value for the Value property; the TreeView control cannot distinguish between different nodes at the same level that have the same value. In this scenario, if the user clicks a node that has a duplicate value, the node that appears first in the TreeView control is selected.

A TreeNode object is made up of the following four user interface (UI) elements, which can be customized or hidden:

  • An expansion node indicator icon used to show whether the node is expanded, collapsed, or non-expandable.

  • An optional check box associated with the node.

  • An optional node image.

  • The node text.

You can specify a custom image for the expandable, collapsible, and non-expandable node indicators by setting the ExpandImageUrl, CollapseImageUrl, and NoExpandImageUrl properties of the TreeView class. The expansion node indicator icons can even be hidden entirely by setting the ShowExpandCollapse property of the TreeView class to false.

To display a check box next to a node, set the ShowCheckBoxes property of the TreeView class. When the ShowCheckBoxes property is set to a value other than TreeNodeType.Node, check boxes are displayed next to the specified node type. You can selectively override the check box of an individual node by setting the node's ShowCheckBox property. When a check box is displayed, use the Checked property to determine whether the check box is selected.

You can display an image in a node by setting the ImageUrl property. This image is displayed next to the node text.

The text of a node in the TreeView control can be in one of two modes: selection mode or navigation mode. By default, a node is in selection mode. To put a node into navigation mode, set the node's NavigateUrl property to a value other than an empty string (""). To put a node into selection mode, set the node's NavigateUrl property to an empty string.

Note

Some Internet browsers have a limitation that can affect the performance of the TreeView control. For example, Microsoft Internet Explorer 6.0 has a URL character limit of 2067 characters that it posts. If the number of characters in a URL of a node is larger than that number, expanding that node will fail and no exception is thrown.

By default, clicking a node that is in selection mode posts the page back to the server and raises the SelectedNodeChanged event. You can optionally specify a different event to raise by setting the node's SelectAction property. For more information, see SelectAction. To determine which node was clicked in selection mode, use the SelectedNode property of the TreeView control.

When a node is in navigation mode, all selection events are disabled for that node. Clicking the node in navigation mode directs the user to the specified URL. You can optionally set the Target property to specify the window or frame in which to display the linked content.

The TreeNode class contains several properties that are used to store the state of the node. Use the Selected property to determine whether a node is selected. To determine whether the node is expanded, use the Expanded property. The DataBound property is used to determine whether a node is bound to data. When a node is bound to data, you can access the underlying data item by using the DataItem property.

The class provides several properties that help to determine the position of a node relative to other nodes in the tree. Use the Depth property to determine the depth of the node. You can get the delimited list of nodes from the current node to its root node by using the ValuePath property. To determine the node's parent node, use the Parent property. Child nodes are accessed using the ChildNodes collection.

Sometimes, it is not practical to statically predefine the tree structure due to data size or custom content that depends on user input. Because of this, the TreeView control supports dynamic node population. A node can be populated at run time when it is expanded. Note that you can get unexpected behavior if you persist asynchronously created nodes. For example, if you use a background worker thread to populate nodes asynchronously, the node tree might not be populated immediately though the control proceeds with the rest of the page life cycle. On postback, the delayed creation of the nodes can cause problems when the control's view state is loaded but the node tree is not fully populated. For more information on dynamic node population, see the PopulateOnDemand property.

For a list of initial property values for an instance of TreeNode, see the TreeNode constructor.

Constructors

TreeNode()

Initializes a new instance of the TreeNode class without text or a value.

TreeNode(String)

Initializes a new instance of the TreeNode class using the specified text.

TreeNode(String, String)

Initializes a new instance of the TreeNode class using the specified text and value.

TreeNode(String, String, String)

Initializes a new instance of the TreeNode class using the specified text, value, and image URL.

TreeNode(String, String, String, String, String)

Initializes a new instance of the TreeNode class using the specified text, value, image URL, navigation URL, and target.

TreeNode(TreeView, Boolean)

Initializes a new instance of the TreeNode class using the specified owner.

Properties

Checked

Gets or sets a value that indicates whether the node's check box is selected.

ChildNodes

Gets a TreeNodeCollection collection that contains the first-level child nodes of the current node.

DataBound

Gets a value that indicates whether the node was created through data binding.

DataItem

Gets the data item that is bound to the control.

DataPath

Gets the path to the data bound to the node.

Depth

Gets the depth of the node.

Expanded

Gets or sets a value that indicates whether the node is expanded.

ImageToolTip

Gets or sets the ToolTip text for the image displayed next to a node.

ImageUrl

Gets or sets the URL to an image that is displayed next to the node.

IsTrackingViewState

Gets a value that indicates whether the node is saving changes to its view state.

NavigateUrl

Gets or sets the URL to navigate to when the node is clicked.

Parent

Gets the parent node of the current node.

PopulateOnDemand

Gets or sets a value that indicates whether the node is populated dynamically.

SelectAction

Gets or sets the event or events to raise when a node is selected.

Selected

Gets or sets a value that indicates whether the node is selected.

ShowCheckBox

Gets or sets a value that indicates whether a check box is displayed next to the node.

Target

Gets or sets the target window or frame in which to display the Web page content associated with a node.

Text

Gets or sets the text displayed for the node in the TreeView control.

ToolTip

Gets or sets the ToolTip text for the node.

Value

Gets or sets a non-displayed value used to store any additional data about the node, such as data used for handling postback events.

ValuePath

Gets the path from the root node to the current node.

Methods

Clone()

Creates a new instance of the TreeNode class with the properties of the current TreeNode instance.

Collapse()

Collapses the current tree node.

CollapseAll()

Collapses the current node and all its child nodes.

Equals(Object)

Determines whether the specified object is equal to the current object.

(Inherited from Object)
Expand()

Expands the current tree node.

ExpandAll()

Expands the current node and all its child nodes.

GetHashCode()

Serves as the default hash function.

(Inherited from Object)
GetType()

Gets the Type of the current instance.

(Inherited from Object)
LoadViewState(Object)

Loads the previously saved view state of the node.

MemberwiseClone()

Creates a shallow copy of the current Object.

(Inherited from Object)
RenderPostText(HtmlTextWriter)

Allows control developers to add additional rendering to the node.

RenderPreText(HtmlTextWriter)

Allows control developers to add additional rendering to the node.

SaveViewState()

Saves the current view state of the node.

Select()

Selects the current node in the TreeView control.

ToggleExpandState()

Alternates between the expanded and collapsed state of the node.

ToString()

Returns a string that represents the current object.

(Inherited from Object)
TrackViewState()

Marks the starting point at which to begin tracking and saving view state changes to the node.

Explicit Interface Implementations

ICloneable.Clone()

Creates a copy of the TreeNode object.

IStateManager.IsTrackingViewState

For a description of this member, see IsTrackingViewState.

IStateManager.LoadViewState(Object)

Loads the node's previously saved view state.

IStateManager.SaveViewState()

Saves the view state changes to a Object.

IStateManager.TrackViewState()

Instructs the TreeNode object to track changes to its view state.

Applies to

See also