65.9K
CodeProject 正在变化。 阅读更多。
Home

ASP TreeList控件(需要Internet Explorer 5.0+)

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.81/5 (18投票s)

2002年4月22日

2分钟阅读

viewsIcon

300468

downloadIcon

3133

一个 ASP 类(经典 ASP),它生成一个动态 HTML 树列表控件,该控件的外观与 Windows 资源管理器树相同,但允许每个树节点有多个数据列。

Sample Image - asptreelistcontrol.gif

引言

我需要一个类来为我正在构建的Web应用程序创建一个树形列表控件,在网上搜索后没有找到类似的东西,所以我决定自己创建。使用HTML、CSS和JScript创建像样的树形列表控件的主要挑战在于,无法有效地创建节点层次结构,并且无法保证每个节点的列与所有其他节点的列对齐。我尝试了div、span、table、tbody、thead、tr、p、ul等,但没有一个提供可接受的解决方案。

我的解决方案是创建一个单一的非层次化表格,并将所有节点信息存储在javascript数组中。当按下+/-按钮时,javascript从数组中推断出需要隐藏哪些行以及需要显示哪些节点。请注意,以这种方式操作,我还必须存储每个可扩展节点的state信息,以便在扩展或折叠节点时,能够维护子节点的展开/折叠状态。

ASP类生成初始树,JScript代码读取html并提取其需要的信息以使树具有交互性。不幸的是,您无法使用当前代码在浏览器中生成树之后更新树,但这没关系,因为我不需要这样做。

我对这个树形列表控件的主要问题是,虽然它生成速度相当快,并且工作正常,但当树中的节点数量达到大约100-200个时(我使用的是Pentium 4,1.4ghz),JScript开始变得非常慢且无响应。如果您发现此控件有用,并且能够优化jscript代码,使其在树中具有大量节点时实际运行速度很快,我将非常感谢您在此处发布更新后的代码,以便我查看。

下面是创建演示树形列表的代码。如您所见,该控件非常易于使用,只需创建控件的实例,添加列标题,然后添加节点即可。如果其父节点尚不存在,则无法添加节点。此外,您不应使用reveal函数显示节点,除非该节点实际存在。否则会导致页面出错。

<!--#include file="treelistcontrol/treelistcontrol.asp"-->
<%
	dim tree
	set tree = new treelistcontrol

	'specify our default settings for the tree

	tree.allowrowselect = false
	tree.showborder = false
	tree.pathtoicons = "treelistcontrol/"
	tree.showdividers = false

	'define the columns for the tree

	tree.addcolumn "Node Name", "", ""
	tree.addcolumn "Day of Week", "100", ""
	tree.addcolumn "Month", "100", ""
	tree.addcolumn "Random Number", "80", "right"
	
	dim id, parentid, theday, themonth, thenumber
	randomize
	for id = 1 to 100
		'make some random values for the tree

		parentid = int(rnd*id)
		theday = weekdayname(int(rnd*7)+1)
		themonth = monthname(int(rnd*12)+1)
		thenumber = formatnumber(int(rnd*1000000),,,true)
		
		'add the node

		tree.addnode id+0, parentid, "treelistcontrol/icon_folder.gif", false, _
				array(id+0, theday, themonth, thenumber)
		
	next
	'reveal node #100

	tree.revealnode 100
	
	response.write tree.value
%>

© . All rights reserved.