TreeView控件
在我们的开发中经常会遇到一些有树形层次关系的数据,比如显示无限级分类和显示某个文件下的所有文件及文件夹,对于这些带有树形层次关系的数据的显示用TreeView控件是一个比较不错的选择。TreeView控件支持数据绑定也支持以编程的方式动态添加节点。在TreeView控件中每个节点都是一个TreeNode对象,我们可以通过TreeNode对象的Nodes属性来添加其它的TreeNode对象,使之成为这个TreeNode对象的子节点。
TreeView对象有以下常见属性:


属性名

说明

CheckedNodes

获取选中了复选框的节点

CollapseImageUrl

节点折叠时的图象

DataSource

绑定到TreeView控件的数据源

DataSourceID

绑定到TreeView控件的数据源控件的ID

EnableClientScript

是否允许客户端处理展开和折叠事件

ExpandDepth

第一次显示时所展开的级数

ExpandImageUrl

节点展开的时的图象

NoExpandImageUrl

不可折叠(即无字节点)的节点的图象

PathSeparator

节点之间的值的路径分隔符

SelectedNode

当前选中的节点

SelectedValue

当前选中的值

ShowCheckBoxes

是否在节点前显示复选框

下面是一个简单的例子。我们的数据都是从一个XML文件中读取的,并将它的节点通过代码的方式添加到TreeView控件中。这个XML文件的物理文件名为area.xml,与下面的asp.net在同一个文件夹下,它的内容如下:

1. <?xml version="1.0" encoding="utf-8" ?>
2. <Area>
3. <Province iAreaID ="1" cAreaName="北京市"/>
4. <Province iAreaID ="2" cAreaName="上海市"/>
5. <Province iAreaID ="3" cAreaName="天津市"/>
6. <Province iAreaID ="4" cAreaName="重庆市"/>
7. <Province iAreaID ="5" cAreaName="湖北省">
8. <City iAreaID ="51" cAreaName="武汉市"/>
9. <City iAreaID ="52" cAreaName="黄冈市" />
10. <City iAreaID ="53" cAreaName="荆州市"/>
11. <City iAreaID ="54" cAreaName="武穴市" />
12. <City iAreaID ="55" cAreaName="十堰市"/>
13. <City iAreaID ="56" cAreaName="黄石市" />
14. </Province>
15. <Province iAreaID ="6" cAreaName="河北省">
16. <City iAreaID ="61" cAreaName="石家庄市"/>
17. <City iAreaID ="62" cAreaName="唐山市" />
18. </Province>
19. <Province iAreaID ="7" cAreaName="山西省">
20. <City iAreaID ="71" cAreaName="太原市" />
21. <City iAreaID ="72" cAreaName="大同市" />
22. </Province>
23. </Area>


前台代码:

1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="TreeDemo.aspx.cs" Inherits="TreeDemo" %>
2. 
3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4. 
5. <html xmlns="http://www.w3.org/1999/xhtml" >
6. <head runat="server">
7. <title>TreeView控件的例子</title>
8. </head>
9. <body>
10. <form id="form1" runat="server">
11. <div>
12. <asp:TreeView ID="treeAreaList" runat="server" AutoGenerateDataBindings="False" OnSelectedNodeChanged="Tree_SelectedNodeChanged">
13. </asp:TreeView>
14. </div>
15. </form>
16. </body>
17. </html>


后台代码如下:

1. using
2. using
3. using
4. using
5. using
6. using
7. using
8. using
9. using
10. using
11. using
12. using
13. 
14. public partial class
15. { 
16.     XmlDocument xmlDoc; 
17. protected void Page_Load(object
18.     { 
19. if
20.         { 
21.             MakeParentNode(); 
22.         } 
23. 
24.     #region  //生成父结点 
25. /// <summary> 
26. /// 生成 
27. /// </summary> 
28. protected void
29.     { 
30.         treeAreaList.Nodes.Clear(); 
31. new
32. "area.xml "));//动态加载XML文档  
33. "Area").ChildNodes;//获取Area节点下的所有子结点  
34. //定义Area结点  
35. new TreeNode();//定义顶级节点 
36. "area "; 
37. //  tn.Value = "-1";  
38. true; 
39. 
40. //添加"区域"父结点  
41. null; 
42. null; 
43. //遍历区域下的所有省和直辖市  
44. foreach (XmlNode node in
45.         { 
46.             element = (XmlElement)node; 
47. new
48. "cAreaName");//在树控件上显示省或直辖市的名称  
49. "iAreaID");//获取节点值 
50. true; 
51. //将省或直辖市级结点添加到顶级节点中  
52. //通过递归将所有子节点添加到节点集合中 
53. 
54.         } 
55. 
56. 
57.     #endregion 
58. 
59.     #region  //生成子结点 
60. /// <summary> 
61. /// 递归将子节点添加到当前节点下 
62. /// </summary> 
63. /// <param name="nodeList">XmlNodeList的实例</param> 
64. /// <param name="treeNode">要添加子节点的父节点</param> 
65. protected void
66.     { 
67. null; 
68. null; 
69. //遍历省级节点下的所有市,市辖区  
70. foreach (XmlNode node in
71.         { 
72.             element = (XmlElement)node; 
73. new
74. "cAreaName");//在树控件上显示市或市辖区的名称  
75. "iAreaID");//这里设置节点Value 
76. true; 
77. //将子结点添加到父结点下面  
78. //递归调用本方法 
79.         } 
80. 
81. 
82.     #endregion 
83. 
84. protected void Tree_SelectedNodeChanged(object
85.     { 
86. "节点的值:" + treeAreaList.SelectedNode.Value+"<br/>"); 
87. "节点的路径:" + treeAreaList.SelectedNode.ValuePath + "<br/>"); 
88. "节点的数据路径:" + treeAreaList.SelectedNode.DataPath + "<br/>"); 
89.     } 
90. }


有关XML文件的读取是一个比较复杂的问题,这里在代码中仅对程序中所使用的代码进行了详尽的注释。这个页面的运行效果如下:

TreeSelect树形控件_asp.net

 

因为我们给TreeView控件的SelectedNodeChanged事件添加了处理方法,所以当我们点击节点时会进行相关的处理,下面是点击黄冈市的效果:

TreeSelect树形控件_TreeSelect树形控件_02