使用ASP腳本制作異步裝載的樹(shù)形結(jié)構(gòu)(一)
發(fā)表時(shí)間:2024-02-17 來(lái)源:明輝站整理相關(guān)軟件相關(guān)文章人氣:
[摘要]樹(shù)形結(jié)構(gòu)是描述層次數(shù)據(jù)的常見(jiàn)方法。本文介紹的樹(shù)形結(jié)構(gòu)生成程序主要由一個(gè)ASP頁(yè)面、二個(gè)JavaScript函數(shù)構(gòu)成。該樹(shù) 形結(jié)構(gòu)是異步的,也就是說(shuō),節(jié)點(diǎn)數(shù)據(jù)僅在必要時(shí)才讀取,而不是一次性全部發(fā)送到客戶端。 一、概述 樹(shù)形結(jié)構(gòu)中所有的節(jié)點(diǎn)都必須包含以下屬性:本身的ID,父節(jié)點(diǎn)的ID,以及本節(jié)點(diǎn)的...
樹(shù)形結(jié)構(gòu)是描述層次數(shù)據(jù)的常見(jiàn)方法。本文介紹的樹(shù)形結(jié)構(gòu)生成程序主要由一個(gè)ASP頁(yè)面、二個(gè)JavaScript函數(shù)構(gòu)成。該樹(shù)
形結(jié)構(gòu)是異步的,也就是說(shuō),節(jié)點(diǎn)數(shù)據(jù)僅在必要時(shí)才讀取,而不是一次性全部發(fā)送到客戶端。
一、概述
樹(shù)形結(jié)構(gòu)中所有的節(jié)點(diǎn)都必須包含以下屬性:本身的ID,父節(jié)點(diǎn)的ID,以及本節(jié)點(diǎn)的說(shuō)明(節(jié)點(diǎn)文本)。本文用到了一個(gè)
Access數(shù)據(jù)庫(kù)Tree.mdb來(lái)保存這些節(jié)點(diǎn)信息。Tree.mdb包含表tblTree,其定義如下:
字段名稱 類型 說(shuō)明
ElementID 自動(dòng)編號(hào) 節(jié)點(diǎn)的唯一標(biāo)識(shí)
ParentElementID 數(shù)字 父節(jié)點(diǎn)的ID
ElementText 文本 節(jié)點(diǎn)文本
本程序利用Tree.dsn文件定義Tree.mdb數(shù)據(jù)源。Tree.dsn內(nèi)容可以用控制面板中的ODBC數(shù)據(jù)源配置程序得到,內(nèi)容如下:
[ODBC]
DRIVER=Microsoft Access Driver (*.mdb)
UID=admin
UserCommitSync=Yes
Threads=3
SafeTransactions=0
PageTimeout=5
MaxScanRows=8
MaxBufferSize=512
ImplicitCommitSync=Yes
FIL=MS Access
DriverId=25
DefaultDir=d:Inetpubwwwroot
DBQ=d:InetpubwwwrootTree.mdb
注意運(yùn)行本文程序時(shí),應(yīng)當(dāng)修改Tree.dsn中的DefaultDir和DBQ,使其指向正確的目錄和文件。
客戶端功能分兩部分實(shí)現(xiàn):其一是一個(gè)普通的瀏覽器窗口,其二為一個(gè)IFRAME。IFRAME是不可見(jiàn)的,它的作用是負(fù)責(zé)瀏覽器
窗口與服務(wù)器之間的通信。下面是示例程序的一個(gè)運(yùn)行界面:
【圖1】
樹(shù)形結(jié)構(gòu)各個(gè)節(jié)點(diǎn)之間的關(guān)系可以用< DIV >標(biāo)記表示如下:
【圖2】
在這里,文檔的< BODY >是第一層節(jié)點(diǎn)(divTree0)的容器,第一層總共包含四個(gè)節(jié)點(diǎn),這四個(gè)節(jié)點(diǎn)又分別是其子節(jié)點(diǎn)組的
容器。例如,上圖中divTree0包含了div1、div2、div3和div4(它們分別對(duì)應(yīng)一個(gè)節(jié)點(diǎn));而div1又是divTree1的容器,
divTree1包含了div5——div8,div5又是divTree5的容器;而divTree5包含了div9……。
鼠標(biāo)單擊事件由各個(gè)節(jié)點(diǎn)本身(div1,div2,……)響應(yīng),而不是由容器響應(yīng)。節(jié)點(diǎn)響應(yīng)鼠標(biāo)單擊事件后將禁止事件進(jìn)一步
向上(向父節(jié)點(diǎn))傳遞。這部分功能在GetTree函數(shù)內(nèi)實(shí)現(xiàn),請(qǐng)參見(jiàn)該函數(shù)代碼以了解具體實(shí)現(xiàn)方法。
整個(gè)樹(shù)形結(jié)構(gòu)的作用過(guò)程可用下圖表示:
【圖3】
二、服務(wù)器端代碼
客戶端腳本向服務(wù)器發(fā)送的請(qǐng)求包含了一個(gè)節(jié)點(diǎn)標(biāo)識(shí),服務(wù)器腳本GetTreeData.asp查找數(shù)據(jù)庫(kù)獲得該節(jié)點(diǎn)的所有子字節(jié)點(diǎn),
并將這些子節(jié)點(diǎn)返回給客戶程序。GetTreeData.asp代碼如下:
< % Dim rstTree
Dim strSQL
Dim strData
If Request.QueryString("Level") = "" Then
Response.End
End If
strSQL = "SELECT * FROM tblTree WHERE ParentElementId = "
strSQL = strSQL & Request.QueryString("Level") & " ORDER BY ElementID "
Set rstTree = Server.CreateObject("ADODB.Recordset")
rstTree.Open strSQL,"FileDSN=d:inetpubwwwroot ree.dsn"
strData = ""
Do While Not rstTree.EOF
strData = strData & rstTree("ElementId") & " " & rstTree("ParentElementId") & " " &
rstTree("ElementText") & " "
rstTree.MoveNext
Loop
rstTree.Close % >
< HTML >
< BODY OnLoad="parent.PopulateTree('< %=strData% >');" >< /BODY >
< /HTML >
注意:在實(shí)際使用中應(yīng)相應(yīng)地更改DSN文件所在路徑。這段代碼并不復(fù)雜,但請(qǐng)注意以下兩點(diǎn):第一,客戶請(qǐng)求的格式應(yīng)該為
“GetTreeData.asp?Level=節(jié)點(diǎn)ID”;第二,返回客戶端的節(jié)點(diǎn)列表格式為“節(jié)點(diǎn)標(biāo)識(shí) 父節(jié)點(diǎn)標(biāo)識(shí) 節(jié)點(diǎn)文本 ……”。 (出處:熱點(diǎn)網(wǎng)絡(luò))