<%'***************************** '******* 连接数据库的树图生成程序 ******** '***************************** '假设你已建立了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> <% '以上程序在WIN2000Server+IIS5.0+SQLServer2000下测试通过。 '========================================================= '======= 作者:夏春涛 E-Mail:[email protected] ====== '========================================================= %> <!-- 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的小图; 这些图片可以通过在资源管理器中抓图获得。 -->

|