Asp. NET provides a series of controls that have page navigation capabilities, including menu controls that display menus on the page, site MapPath controls that provide Web navigation, and tree (TreeView) controls that display hierarchies. The examples in this chapter describe the applications of these controls in creating Web applications.
Implementing a static TreeView control navigation
The TreeView control is a tree-structured control. This control is used to display hierarchical data, such as a file directory. Each node of the TreeView control is a TreeNode object with the Text property and Value property, and the Text property specifies the text that is displayed in the node, and the Value property is the values that get the node. Each node has the status of selection and navigation, and the NavigateUrl property determines the state of the node, which is the navigation state when the property is not an empty string (""), or the selected state. By default, there is a node in the selection state.
The nodes of the TreeView control contains a collection of all nodes, you can add nodes to the TreeView control with a designer, or you can add nodes dynamically by using a programmatic approach. If the TreeView control needs to display a very good number of nodes, a one-time load can affect efficiency, in which case the PopulateOnDemand property of the TreeView control can be set to true, then the Treenodepopulate event is raised when the node is expanded , the child nodes are loaded programmatically in this event. This example demonstrates how to use the static node of the TreeView control to implement page navigation.
Technical points
The technical essentials for Implementing a static TreeView control navigation are as follows.
The nodes property of the TreeView control contains all nodes and programmatically adds nodes to the attribute.
The TreeNode object is used as a node of the TreeView control to set navigation information through the object.
Implementation steps
(1) Create a asp.net web site in VS2008, named "TreeViewSample1".
(2) Add a page named "Treeviewcontrol.aspx" and set the page as the starting page.
(3) Select the TreeView Control Design page from the Toolbox.
(4) When the page is first loaded, first create a root node, without any navigation information, and then add the node information to the child node. The code looks like this.
<%@ Page language= "C #" autoeventwireup= "true"%>
<script runat= "Server" >
protected void Page_Load (object sender, EventArgs e)
{
if (! IsPostBack)
{
This. Treeview1.showlines = true;//Display gridlines in controls
TreeNode RootNode = new TreeNode ();//define root node
Rootnode.text = "Classified Product";
TreeNode TR1 = new TreeNode ();//define child nodes
TR1. Text = "Electrical Class";
TR1. NavigateUrl = "~/electric.aspx";
ROOTNODE.CHILDNODES.ADD (TR1);//The handle node is added to the root node
TreeNode TR2 = new TreeNode ();
TR2. Text = "food category";
TR2. NavigateUrl = "~/food.aspx";
TreeNode tr21 = new TreeNode ();
Tr21. Text = "Apple";
Tr21. NavigateUrl = "~/apple.aspx";
TR2. Childnodes.add (TR21);//Add Level two child nodes
ROOTNODE.CHILDNODES.ADD (TR2);
TreeNode TR3 = new TreeNode ();
TR3. Text = "commodity class";
TR3. NavigateUrl = "~/commodity.aspx";
ROOTNODE.CHILDNODES.ADD (TR3);
This. TREEVIEW1.NODES.ADD (RootNode);//Add root node to the TreeView control
}
}
</script>
<title>treeview Use examples </title>
<body>
<form id= "Form1" runat= "Server" >
<div>
<asp:treeview id= "TreeView1" runat= "Server" >
</asp:TreeView>
</div>
</form>
</body>
(5) Press Ctrl+f5 key combination to run the program,
The results of the operation are shown in Figure 22.1.
Figure 22.1 Running results
Source program Interpretation
(1) The TreeView control has a rich set of properties, and the Showlines property determines whether the connection is displayed between nodes.
(2) The TreeNode object represents a node of the TreeView control, and the object's ChildNodes property contains the child nodes of the node.