利用Treeview实现树形列表

原创 2004年09月14日 10:40:00
以前,在WEB页面中如果想使用树形控件的话,往往会有些麻烦,有时甚至要自己写代码来达到用树形列表显示数据的目的。在asp.net中,我们可以很方便地使用由微软提供的Internet Exploer Web Controls控件来实现树形列表。在微软提供的这套Internet Exploere Web Controls控件集合中,包括有MultiPage,TabStrip,TOOLbar,Treeview控件。在这篇文章中,我们来看在ASP.net中如何使用Treeview控件和XML来实现树形列表。

  微软的这套控件可以在http://asp.net/IEWebControls/Download.aspx?tabindex=0&tabid=1中下载,下载后运行setup安装就可以了。现在我们来试下用Treeview控件做个简单的例子。

  在vs.net中新建一个WEB工程,之后在工具箱中,鼠标右键弹出的菜单中,选择“添加新项”,在自定义工具箱中,选择TREEVIEW控件(注意选择的是命名空间为Microsoft Internet Exploere web control的命名空间),按确定后,就可以在工具箱中出现Treeview控件了。

  接着,将treeview控件拖拉到窗体中,切换到HTML视图,这时会发现有如下代码:

<%@ Register TagPrefix="ie"
Namespace="Microsoft.Web.UI.WebControls"
Assembly="Microsoft.Web.UI.WebControls" %>

  当然,你可以改变TagPrefix的标记值,比如,改为FooBar,那么以后在引用Treeview控件时,就用如下方式引用:

  现在,我们可以通过点选Treeview控件的属性框中的nodes属性,来为该树添加各类结点了,由于比较简单,这里不详细讲述。下面是添加完各类结点后的代码:


 <?xml:namespace prefix = ie />
  
  
  
  
  
  
  
  
  
  
  
   
   
  
 
 
  
  
  。。。。。。
 

  其中我们特别注意一下Expanded="True"中的Expanded属性,该属性当被设置为true时,则当页面被装载时,树形控件被全部展开。

  以上是在设计时,静态添加数据到树形控件的方法。而由于XML实质上也是以树形结构来表示数据的结构,因此,就可以通过使用XML文件绑定到树形控件的方法,来动态加载数据到控件中去,其中有两种方法可以实现:

  1)另外写一个符合TREEVIEW格式的XML文件

  2)通过XSL将XML进行转换。

  先来看下第一种方法,建一个XML文件作为例子,命名为aspnetbooks.xml:

<?xml version="1.0" encoding="UTF-8"?>
 
  
  
  
   Mitchell
   Atkinson
  
  1999
 

 
  
  
   Mitchell
  
  2000
 

 
  
  
   Mitchell
   Mack
   Walther
   Seven
   Anders
   Nathan
   Wahlin
  
  2001
 

 
  
  
   Walther
  
  1998
 

  如果我们使用第一种方法,必须对XML进行重写,用以下的形式表示,才能绑定到树形控件中去。


 
  
  

 

 ...

  就是说,根结点必须是treenodes(大小写都无所谓),每个子结点必须以的形式排列。于是,我们对原来的XML文件改写为如下的形式:

<?xml version="1.0" encoding="UTF-8"?>
 
  
   
   
   
   
  
  
  

  
   
   
   
  
  
  
〈/TREENODES>

  增加以下代码:



TreeNodeSrc="aspnetbooks.xml" />

  这样就将该xml文件绑定到树形控件中去了,运行后可以看到结果:

ASP.NET Books
Teach Yourself Active Server Pages 3.0 in 21 Days
Designing Active Server Pages
ASP.NET: Tips, Tutorials, and Code
Programming ASP.NET

  可以看到,使用第一种方法的确比较麻烦,不能对XML的结点进行筛选或者其他操作。而如果使用第二种方法的XSL,则可以根据需要随时对原来的XML进行格式的控制,十分方便。

  在使用XSL时,可以用如下的方法对树形控件进行绑定:


 
      TreeNodeSrc="aspnetbooks.xml"
    TreeNodeXsltSrc="aspbooks.xsl" />
 

  其中,treenodexsltsrc的属性中指定要转换的XSL文件,我们设计的XSL文件如下:

<?xml:namespace prefix = xsl />http://www.w3.org/1999/XSL/Transform" version='1.0'>
 
 
  
  
   
    
   

  
   
    Price - $
   
  

  
   
   
    
     
    
   
  
 

 
  
     Year Published -
  
 




  在上面的XSL中,我们通过形如



  的属性设置,提取XML文件中每个结点的值,将其赋值给予treenode的text属性中。当然,也可以在XSL中使用XPATH等设置要显示的结点。

  运行后,结果同样与用第一种方法的一样,能正确显示树形控件,而且灵活性比较高。

Android中的列表树形展示,AndroidTreeView的使用动态设置树形结构

AndroidTreeView,动态加载树形结构详解
  • yingtian648
  • yingtian648
  • 2017年02月22日 23:30
  • 1179

Android UI 之实现多级列表TreeView

所谓TreeView就是在Windows中常见的多级列表树,在Android中系统只默认提供了ListView和ExpandableListView两种列表,最多只支持到二级列表的实现,所以如果想要实...
  • u013749540
  • u013749540
  • 2017年03月01日 17:49
  • 397

Bootstrap树形菜单插件TreeView.js使用方法详解

Bootstrap树形菜单插件TreeView.js使用方法详解
  • educast
  • educast
  • 2016年12月14日 14:48
  • 16127

Winfrom开发之通过treeview实现树形结构

Winfrom开发之通过treeview实现树形结构 方法一、 节点法 分析 节点法类似于树形结构中的树,通过父节点和子节点 以及节点深度来查找 根节点没有父节点 深度为0 部门与所属子部门的...
  • l1158513573
  • l1158513573
  • 2015年07月01日 20:00
  • 2251

TreeView树形菜单绑定

前台:
  • qq_31971935
  • qq_31971935
  • 2015年10月13日 10:48
  • 1404

Qt树形控件QTreeView使用1——节点的添加删除操作

QTreeView 和 QStandardItemModel的使用 QtreeView是ui中最常用的控件,Qt中QTreeWidget比QTreeView更简单,但没有QTreeView那么...
  • czyt1988
  • czyt1988
  • 2014年02月08日 23:15
  • 25673

autoit实现树形结构的实例

#cs ____________________________________                  Au3 版本: 3.3.6.1         脚本作者: 風冄·訴華年  ...
  • wozijisunfly
  • wozijisunfly
  • 2014年10月24日 18:33
  • 1631

Unity UGUI自定义树形菜单(TreeView)

先上几张效果图:        如果你需要的也是这种效果,那你就来对地方了!目前,我们这个树形菜单展现出来的功能如下:1、可以动态配置数据源;2、点击每个元素的上下文菜单按钮(也就是图中的三角形按钮)...
  • qq992817263
  • qq992817263
  • 2017年02月08日 14:30
  • 5624

C# 系统应用之TreeView控件 (一).显示树状磁盘文件目录及加载图标

文章主要讲述使用C# winForm实现类似于资源管理器的界面,通过TreeView控件显示"我的电脑"所有磁盘文件树状目录,包括"我的文档",所有盘符下子目录.同时通过ImageList加载不同类型...
  • Eastmount
  • Eastmount
  • 2014年02月19日 15:30
  • 23040

iOS树状视图(折叠单元格)详细使用

RATreeView是一个第三方的iOS树视图(通俗的讲就是折叠单元格),它是对UITableView的封装,定义自己的委托和数据源的法,RATreeView是高度可定制的,并且有很多功能。很多朋友都...
  • hbblzjy
  • hbblzjy
  • 2016年07月19日 11:45
  • 2587
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:利用Treeview实现树形列表
举报原因:
原因补充:

(最多只允许输入30个字)