连接数据库的ASP树图生成程序
类别: ASP教程
<%
\'假设你已建立了SQLServer数据库UnitTree,并在该库中建立了表:
\'Units(ID 单位序号整数唯一,Name 单位名称字符串,UpID 上级单位序号整数)
\'注:UpID=0表示该单位是根结点单位;
\'输入一些数据如:(1,AA,0)(2,AABB,1)(3,AACC,1)(4,AABB11,2)
\'以便进行下面的程序测试。
%>
<% \'建立数据库连接
set conn=server.createobject("adodb.connection")
conn.open "provider=sqloledb;data source=YourSrcName;user id=sa;password=;database=UnitTree"
%>
<%\'子过程:生成树图子结点数据
Sub TreeNode(Code)
SQLUnit="select ID,Name"&_
" from Units"&_
" where UpID="&Code&""&_
" order by ID"
set rsUnit=conn.Execute(SQLUnit)
Do while not rsUnit.Eof
Response.Write("Node"&rsUnit("ID")&"=appendChild("&"Node"&Code&",folderNode(\'"&rsUnit("Name")&"\',\'"&rsUnit("ID")&"\',0))"&chr(10))
call TreeNode(rsUnit("ID"))
rsUnit.movenext
Loop
End Sub
%>
<HTML>
<HEAD>
<title>演习分析</title>
<Script LANGUAGE="javascript">
/****************************** 生成树图数据 *********************************/
function generateTree()
{
//生成树图数据
//-----VBScript-----
<%
\'\'显示单位
SQLUnit0="select ID,Name"&_
" from Units"&_
" where UpID=0"&_
" order by ID"
set rsUnit0=conn.Execute(SQLUnit0)
//根结点foldersTree
Response.Write("foldersTree=folderNode(\'"&rsUnit0("Name")&"\',\'"&rsUnit0("ID")&"\',1)"&chr(10))
Response.Write("Node"&rsUnit0("ID")&"=foldersTree"&chr(10))
call TreeNode(rsUnit0("ID")) //子结点数据
%>
}
/**************************** 生成树图数 结束 *******************************/
</Script>
<Script LANGUAGE="javascript">
/************************ 相关函数 *********************************/
// 生成一个节点
function folderNode(name,value,flagOpen)
{
var arrayAux
arrayAux = new Array
arrayAux[0] = flagOpen //结点关闭0或打开1
arrayAux[1] = value //
arrayAux[2] = name //名称
return arrayAux
}
//在arrayAux[3]..[n]中添加其孩子
function appendChild(parent, child)
{
parent[parent.length] = child
return child
}
//画结点
//参数 foldersNode:结点
// doc :document对象
// level :结点的层次
// lastNode :是否最末尾的结点
// leftSide :图片
function redrawNode(foldersNode, doc, level, lastNode, leftSide)
{
FileName="Content.asp" //设置超链接文件,可根据你的情况改写……………
var j=0
var i=0
doc.write("<table border=0 cellspacing=0 cellpadding=0>")
doc.write("<tr><td valign = middle nowrap>")
doc.write(leftSide)
/******分层+/-号**************************************/
if (level>0)//不是根节点
{
if (lastNode) //最后的节点
{
if (foldersNode.length > 3)//有孩子
{
if (foldersNode[0])//且打开
{
doc.write("<A href=\'javascript:top.openBranch("" + foldersNode[2] + "")\'>")
doc.write("<img border=0 src=../../Images/lastnode-.gif width=16 height=22></a>")
}
else
{ //但关闭
doc.write("<A href=\'javascript:top.openBranch("" + foldersNode[2] + "")\'>")
doc.write("<img border=0 src=../../Images/lastnode+.gif width=16 height=22></a>")
}
}
else //没孩子
doc.write("<img src=\'../../Images/lastnode.gif\' width=16 height=22>")
leftSide = leftSide + "<img src=\'../../Images/blank.gif\' width=16 height=22>"
}
else //非最后节点
{
if (foldersNode.length > 3)//有孩子
{
if (foldersNode[0])//且打开
{
doc.write("<A href=\'javascript:top.openBranch("" + foldersNode[2] + "")\'>")
doc.write("<img border=0 src=../../Images/Node-.gif width=16 height=22></a>")
}
else
{ //但关闭
doc.write("<A href=\'javascript:top.openBranch("" + foldersNode[2] + "")\'>")
doc.write("<img border=0 src=../../Images/Node+.gif width=16 height=22></a>")
}
}
else //没孩子
doc.write("<img src=\'../../Images/node.gif\' width=16 height=22>")
leftSide = leftSide + "<img src=\'../../Images/vertline.gif\' width=16 height=22>"
}
/******手形图标与超链接**********/
doc.write("<a href=\'"+FileName+"?ID="+foldersNode[1]+"&Name="+foldersNode[2]+"\' target=folderFrame><img src=../../Images/closedfolder.gif width=24 height=22 border=noborder></a>")
/********名称与超链接********/
doc.write("<td valign=middle align=left nowrap>")
doc.write("<a href=\'"+FileName+"?ID="+foldersNode[1]+"&Name="+foldersNode[2]+"\' target=folderFrame><font size=2 face=\'宋体\'>"+foldersNode[2]+"</font></a>")
//以上超链接提供了ID,Name的QueryString值……………………………………
}
else//根节点
{
/******手形图标与超链接**********/
doc.write("<a href=\'"+FileName+"?ID="+foldersNode[1]+"&Name="+foldersNode[2]+"\' target=folderFrame><img src=../../Images/closedfolder.gif width=24 height=22 border=noborder></a>")
/********名称与超链接********/
doc.write("<td valign=middle align=left nowrap>")
doc.write("<a href=\'"+FileName+"?ID="+foldersNode[1]+"&Name="+foldersNode[2]+"\' target=folderFrame><font size=2 face=\'宋体\'>"+foldersNode[2]+"</font></a>")
}
doc.write("</table>")
///////////////////////////////////////////////////////
if (foldersNode.length > 3 && foldersNode[0]) //有孩子且打开则递归显示节点
{
level=level+1
for (i=3; i<foldersNode.length;i++)
if (i==foldersNode.length-1)
redrawNode(foldersNode[i], doc, level, 1, leftSide)
else
redrawNode(foldersNode[i], doc, level, 0, leftSide)
}
}
//当用户点击分层的+/-号时响应,被openBranch调用
function clickOnFolderRec(foldersNode, folderName)
{
var i=0
if (foldersNode[2] == folderName)
{
if (foldersNode[0])//若为打开状态时,则将其关闭
foldersNode[0] = 0
else
foldersNode[0] = 1
}
else
{
for (i=3; i< foldersNode.length; i++)
clickOnFolderRec(foldersNode[i], folderName)
}
}
//打开或关闭结点(当用户点击分层的+/-号时响应)
function openBranch(branchName)
{
clickOnFolderRec(foldersTree, branchName)
timeOutId = setTimeout("redrawTree()",100)
}
//显示树图
function redrawTree()
{
var doc = top.treeFrame.window.document
//记录当前滚动条位置
posX = doc.body.scrollLeft
posY = doc.body.scrollTop
doc.open()
doc.write("<body link=\'#0000ff\' vlink=\'#0000ff\' alink=\'##ff0000\' bgcolor=\'white\'>")
redrawNode(foldersTree, doc, 0, 1, "")
doc.close()
doc.body.scrollLeft = posX
doc.body.scrollTop = posY
}
//网页载入时响应的函数
function initializeTree()
{
generateTree()
redrawTree()
}
/*********************** 相关函数 END *************************/
</Script>
</HEAD>
<FRAMESET cols="220,*" onLoad="initializeTree()" framespacing="1">
<FRAME src="Pleft.htm" name="treeFrame" target="_self" scrolling="auto">
<FRAME SRC="PRight.htm" name="folderFrame" scrolling="auto">
</FRAMESET>
</HTML>
<!--
PLeft.htm文件的内容:
<html>
<body>
<p align=center><font size=2>正在生成树图,请稍候...</font>
</body>
</html>
PRight.htm文件的内容:
<html>
<body>
<p align=center><font size=2>欢迎访问!</font>
</body>
</html>
Content.asp文件根据你的需要自己编写。
程序执行的效果,与Windows的资源管理器几乎一样。
closedfolder.gif是一个22*22的小图,其余的图片是16*22的小图;
这些图片可以通过在资源管理器中抓图获得。
-->
\'假设你已建立了SQLServer数据库UnitTree,并在该库中建立了表:
\'Units(ID 单位序号整数唯一,Name 单位名称字符串,UpID 上级单位序号整数)
\'注:UpID=0表示该单位是根结点单位;
\'输入一些数据如:(1,AA,0)(2,AABB,1)(3,AACC,1)(4,AABB11,2)
\'以便进行下面的程序测试。
%>
<% \'建立数据库连接
set conn=server.createobject("adodb.connection")
conn.open "provider=sqloledb;data source=YourSrcName;user id=sa;password=;database=UnitTree"
%>
<%\'子过程:生成树图子结点数据
Sub TreeNode(Code)
SQLUnit="select ID,Name"&_
" from Units"&_
" where UpID="&Code&""&_
" order by ID"
set rsUnit=conn.Execute(SQLUnit)
Do while not rsUnit.Eof
Response.Write("Node"&rsUnit("ID")&"=appendChild("&"Node"&Code&",folderNode(\'"&rsUnit("Name")&"\',\'"&rsUnit("ID")&"\',0))"&chr(10))
call TreeNode(rsUnit("ID"))
rsUnit.movenext
Loop
End Sub
%>
<HTML>
<HEAD>
<title>演习分析</title>
<Script LANGUAGE="javascript">
/****************************** 生成树图数据 *********************************/
function generateTree()
{
//生成树图数据
//-----VBScript-----
<%
\'\'显示单位
SQLUnit0="select ID,Name"&_
" from Units"&_
" where UpID=0"&_
" order by ID"
set rsUnit0=conn.Execute(SQLUnit0)
//根结点foldersTree
Response.Write("foldersTree=folderNode(\'"&rsUnit0("Name")&"\',\'"&rsUnit0("ID")&"\',1)"&chr(10))
Response.Write("Node"&rsUnit0("ID")&"=foldersTree"&chr(10))
call TreeNode(rsUnit0("ID")) //子结点数据
%>
}
/**************************** 生成树图数 结束 *******************************/
</Script>
<Script LANGUAGE="javascript">
/************************ 相关函数 *********************************/
// 生成一个节点
function folderNode(name,value,flagOpen)
{
var arrayAux
arrayAux = new Array
arrayAux[0] = flagOpen //结点关闭0或打开1
arrayAux[1] = value //
arrayAux[2] = name //名称
return arrayAux
}
//在arrayAux[3]..[n]中添加其孩子
function appendChild(parent, child)
{
parent[parent.length] = child
return child
}
//画结点
//参数 foldersNode:结点
// doc :document对象
// level :结点的层次
// lastNode :是否最末尾的结点
// leftSide :图片
function redrawNode(foldersNode, doc, level, lastNode, leftSide)
{
FileName="Content.asp" //设置超链接文件,可根据你的情况改写……………
var j=0
var i=0
doc.write("<table border=0 cellspacing=0 cellpadding=0>")
doc.write("<tr><td valign = middle nowrap>")
doc.write(leftSide)
/******分层+/-号**************************************/
if (level>0)//不是根节点
{
if (lastNode) //最后的节点
{
if (foldersNode.length > 3)//有孩子
{
if (foldersNode[0])//且打开
{
doc.write("<A href=\'javascript:top.openBranch("" + foldersNode[2] + "")\'>")
doc.write("<img border=0 src=../../Images/lastnode-.gif width=16 height=22></a>")
}
else
{ //但关闭
doc.write("<A href=\'javascript:top.openBranch("" + foldersNode[2] + "")\'>")
doc.write("<img border=0 src=../../Images/lastnode+.gif width=16 height=22></a>")
}
}
else //没孩子
doc.write("<img src=\'../../Images/lastnode.gif\' width=16 height=22>")
leftSide = leftSide + "<img src=\'../../Images/blank.gif\' width=16 height=22>"
}
else //非最后节点
{
if (foldersNode.length > 3)//有孩子
{
if (foldersNode[0])//且打开
{
doc.write("<A href=\'javascript:top.openBranch("" + foldersNode[2] + "")\'>")
doc.write("<img border=0 src=../../Images/Node-.gif width=16 height=22></a>")
}
else
{ //但关闭
doc.write("<A href=\'javascript:top.openBranch("" + foldersNode[2] + "")\'>")
doc.write("<img border=0 src=../../Images/Node+.gif width=16 height=22></a>")
}
}
else //没孩子
doc.write("<img src=\'../../Images/node.gif\' width=16 height=22>")
leftSide = leftSide + "<img src=\'../../Images/vertline.gif\' width=16 height=22>"
}
/******手形图标与超链接**********/
doc.write("<a href=\'"+FileName+"?ID="+foldersNode[1]+"&Name="+foldersNode[2]+"\' target=folderFrame><img src=../../Images/closedfolder.gif width=24 height=22 border=noborder></a>")
/********名称与超链接********/
doc.write("<td valign=middle align=left nowrap>")
doc.write("<a href=\'"+FileName+"?ID="+foldersNode[1]+"&Name="+foldersNode[2]+"\' target=folderFrame><font size=2 face=\'宋体\'>"+foldersNode[2]+"</font></a>")
//以上超链接提供了ID,Name的QueryString值……………………………………
}
else//根节点
{
/******手形图标与超链接**********/
doc.write("<a href=\'"+FileName+"?ID="+foldersNode[1]+"&Name="+foldersNode[2]+"\' target=folderFrame><img src=../../Images/closedfolder.gif width=24 height=22 border=noborder></a>")
/********名称与超链接********/
doc.write("<td valign=middle align=left nowrap>")
doc.write("<a href=\'"+FileName+"?ID="+foldersNode[1]+"&Name="+foldersNode[2]+"\' target=folderFrame><font size=2 face=\'宋体\'>"+foldersNode[2]+"</font></a>")
}
doc.write("</table>")
///////////////////////////////////////////////////////
if (foldersNode.length > 3 && foldersNode[0]) //有孩子且打开则递归显示节点
{
level=level+1
for (i=3; i<foldersNode.length;i++)
if (i==foldersNode.length-1)
redrawNode(foldersNode[i], doc, level, 1, leftSide)
else
redrawNode(foldersNode[i], doc, level, 0, leftSide)
}
}
//当用户点击分层的+/-号时响应,被openBranch调用
function clickOnFolderRec(foldersNode, folderName)
{
var i=0
if (foldersNode[2] == folderName)
{
if (foldersNode[0])//若为打开状态时,则将其关闭
foldersNode[0] = 0
else
foldersNode[0] = 1
}
else
{
for (i=3; i< foldersNode.length; i++)
clickOnFolderRec(foldersNode[i], folderName)
}
}
//打开或关闭结点(当用户点击分层的+/-号时响应)
function openBranch(branchName)
{
clickOnFolderRec(foldersTree, branchName)
timeOutId = setTimeout("redrawTree()",100)
}
//显示树图
function redrawTree()
{
var doc = top.treeFrame.window.document
//记录当前滚动条位置
posX = doc.body.scrollLeft
posY = doc.body.scrollTop
doc.open()
doc.write("<body link=\'#0000ff\' vlink=\'#0000ff\' alink=\'##ff0000\' bgcolor=\'white\'>")
redrawNode(foldersTree, doc, 0, 1, "")
doc.close()
doc.body.scrollLeft = posX
doc.body.scrollTop = posY
}
//网页载入时响应的函数
function initializeTree()
{
generateTree()
redrawTree()
}
/*********************** 相关函数 END *************************/
</Script>
</HEAD>
<FRAMESET cols="220,*" onLoad="initializeTree()" framespacing="1">
<FRAME src="Pleft.htm" name="treeFrame" target="_self" scrolling="auto">
<FRAME SRC="PRight.htm" name="folderFrame" scrolling="auto">
</FRAMESET>
</HTML>
<!--
PLeft.htm文件的内容:
<html>
<body>
<p align=center><font size=2>正在生成树图,请稍候...</font>
</body>
</html>
PRight.htm文件的内容:
<html>
<body>
<p align=center><font size=2>欢迎访问!</font>
</body>
</html>
Content.asp文件根据你的需要自己编写。
程序执行的效果,与Windows的资源管理器几乎一样。
closedfolder.gif是一个22*22的小图,其余的图片是16*22的小图;
这些图片可以通过在资源管理器中抓图获得。
-->
- 上一篇: ASP生成柱型体、折线图、饼图源代码
- 下一篇: ASP中使用MD5加密字符
-= 资 源 教 程 =-
文 章 搜 索