TreeView控件在宿舍管理系统中分类导航的设计与应用

袁芳

摘要：TreeView控件是以树形目录形式显示数据，并能分层展开和收缩各节点子目录。该文以学生宿舍管理系统为例，介绍通过使用TreeView控件以树形目录的形式添加菜单，连接到不同的功能页面的导航的几种方法。

关键词：TreeView控件；XML；宿舍管理

中图分类号：TP311 文献标识码：A 文章编号：1009-3044（2015）31-0088-03

The Design and Application of Cassified Navigation by TreeView Control in the Dormitory Management System

YUAN Fang

（Dept of Information Engineeringr， Jiangxi Vocational College of Finance & Economics， Jiujiang 332000， China）

Abstract： The TreeView control can display data by a form of tree directory ， and can be layered expansion and contraction of the various sections of the directory. This paper takes student dormitory management system as an example， it introduces several methods of using the TreeView control to add menu in the form of a tree directory， and connect to different functions pages.

Key words： TreeView control； XML； dormitory management

在Web应用中，对于导航文字非常多，并且对导航内容可以进行分类的网站来说，可以将页面中的导航文字以树形目录的形式来显示，这样不仅可以有效地节约页面，而且大大方便了用户的遍历访问站点中的不同页面。

在Visual Studio 2010中，TreeView控件的基本功能是将有序的层次化结构数据显示为树形结构，该控件可以轻松快捷设计树形结构导航系统。在Web应用开发中，该控件的层次数据可以设计时添加，也可以通过编程操作TreeNode对象动态地添加和修改，还可以使用数据源控件进行绑定，如利用XMLDataSource从XML文件中或缺填充数据，使用SiteMapDataSource控件将网站地图数据填充到TreeView控件中[1]。下面以学生宿舍管理系统中分成楼房管理、宿舍管理、住宿管理和分类统计四个模块的导航为例，介绍TreeView控件的设置与应用的方法。

1 TreeView控件设计时添加数据

创建Web窗体后，可通过拖放的方式将TreeView控件添加到Web页的适当位置，在Web页上就会显示如图1所示的TreeView 控件和“TreeView任务”快捷菜单。快捷菜单可以设置TreeView控件常用的任务，其中自动套用格式是用于设置控件外观，选择数据源是

用于连接一个现有数据源或创建一个数据源[2]。

图1 TreeView控件

选择“编辑节点”命令，会弹出如图2所示的对话框，可以定义TreeView控件的节点和相关属性，通过添加节点和子节点方式设置每个节点TreeNode的Text，value和NavigateURL属性值，如图2所示，即可完成宿舍管理系统的导航，产生相应TreeView控件部分源代码如下。

……

图2 TreeView控件节点编辑器

2 TreeView控件绑定XML文件

首先根据宿舍管理系统中需要导航数据建一份XML的文件NavigateXML.xml，在该XML文件中依据导航的4个分类，构建根节点（Root）、父节点（ParentNode）、子节点（ChildNode），并设置每个节点中的导航地址url属性和导航名称Text属性，部分代码如下所示。

……

然后在页面上添加TreeView和XmlDataSource控件，配置XMLDataSource数据源命令中，选数据文件为刚才建立的NavigateXML.xml文件即可。TreeView控件的DataSourceID属性设为XmlDataSource控件的ID值，并编辑“TreeNode任务”快捷菜单中“编辑TreeNode数据绑定”命令，添加Root、ParentNode和ChildNode 3个节点，并设置相应的NavigateUrlField为url和TextField为Text属性值，如图3所示。

如果要做网站的站点地图的导航，在Asp.net中可以建唯一的Web.sitemap站点地图文件，该文件用于存储站点导航信息，该站点地图文件也是采用了xml格式，将站点逻辑结构层次化地列出来，原理与绑定xml文件类似，区别在于页面上添加SiteMapDataSource数据源控件，SiteMapDataSource控件不需任何设置，把TreeView控件的DataSourceID属性设为SiteMapDataSource控件的ID值，即可完成站点导航，操作起来更加便捷 。

图3 TreeView控件绑定XML文件

3 TreeView控件绑定到数据库

上述介绍的方法是采用静态方式，即节点的名称和数量不随意发生扩展变化，但在很多实际应用中，节点的数据往往来自数据库[3]，并按实际的需求在页面上添加或修改导航信息，使导航动态的发生变化，而不是去修改对应的文件里的导航信息的源代码。

3.1 数据库设计

在SQL Server 2008数据库中建立StuDormManager.mdf数据库文件，在该数据库中建立数据表文件SDManageNavigate，其对应表的结构如表1，其中ParentID为分类号，用来标识当前分类组的唯一标识，当 ParentId为0时，表示该分类为顶层；当ParentId值为大于0时，表示归属于对应的分类，从而形成一个具有层次结构的数据源，构造数据表文件SDManageNavigate如图4所示。

表1 SDManageNavigate表结构

[序号＼&字段名＼&数据类型＼&备注＼&1＼&Id＼&Int（自动编号）＼&主键＼&2＼&Text＼&Nvarchar（50）＼&导航文字＼&3＼&ParentId＼&Int＼&父类Id＼&4＼&NavigateUrl＼&Nvarchar（50）＼&导航地址＼&]

图4 SDManageNavigate表数据

图5 分类导航的界面

3.2 代码实现

在对应Treeview页面的.cs代码中，定义全局的数据集对象DSdata，再自定义一个方法CreateTree，该方法的主要功能是将数据库中的数据填充到TreeView控件中，实现的过程是从根节点开始递归调用填充TreeView控件。

protected DataSet DSdata； //DSdata为存储建树数据信息的数据集

public void CreateTree（TreeNodeCollection Nodeds， string parentId） {

TreeNode NewNode；

//用父节点进行筛选数据集中信息

DataRow[] rows = DSdata.Tables[“Navigate”].Select（"parentId='" + parentId + "'"）；

foreach （DataRow row in rows） {

//设置父节点

NewNode = new TreeNode（row["Text"].ToString（），

row["Id"].ToString（）， ""， row["NavigateUrl"].ToString（）， ""）；

Nodeds.Add（NewNode）；

//添加子节点，递归调用

CreateTree（NewNode.ChildNodes， row["Id"].ToString（））； }

在页面加载事件Page_Load里编写如下代码。

//通过配置文件Web.Config的ConnectionStrings节点获取数据连接语句，并创建数据库连接对象

SqlConnection sqlconn = new SqlConnection（ConfigurationManager.ConnectionStrings["SDMConnetionString"].ToString（））；

//通过数据适配器SqlDataAdapter，获取数据表SDManageNavigate里的数据，并通过Fill方法填充到数据集DSdata中，给其表名为Navigate

SqlDataAdapter SDAdapter = new SqlDataAdapter（"select * from SDManageNavigate "， sqlconn）；

DSdata = new DataSet（）；

SDAdapter.Fill（DSdata， "Navigate"）；

// CreateTree方法绑定TreeView控件，TreeView控件的Id为TreeViewNavigate

CreateTree（TreeViewNavigate.Nodes， "0"）；

4 结束语

本文在Visual Studio 2010 环境下，以学生宿舍管理系统分类导航为例，介绍几种设置TreeView实现分类导航的方法，其中动态方式即Treeview控件动态绑定到SQL Server 数据表方式，该方式比设计方式即添加TreeView控件的节点更具有灵活性[4]，我们可以设计开发导航栏分类的管理页面，在该页面中根据需求，动态修改导航栏信息，而不需要修改对应文件的源代码。

参考文献：

[1] 沈士根， 汪承焱， 许小东. Web程序设计：ASP.NET实用网站开发[M]. 北京： 清华大学出版社， 2009， 5.

[2] 明日科技. Asp.net从入门到精通[M]. 北京： 清华大学出版社， 2014.

[3] 韩小祥. 数据绑定技术在TreeView控件中的应用[J]. 现代计算机， 2013（1）： 42-44.

[4] 胡海斌. 动态绑定TreeView控件实现网站分类导航[J]. 现代计算机， 2014（8）： 65-68.