關於非同步載入樹的討論
來源:互聯網
上載者:User
幾個月前做項目時遇到的一個問題, 大概有幾千條資料,要求以樹狀顯示,採用一次載入的方法無法實現,決定採用非同步載入的方法,在網上找到個開源的東東XLOADTREE2,XTREE2(兩個超長的JS程式)。試用之後,感覺和實際應用還有些差距。因為系統的底層架構已經搭好拉,從資料庫中取資料(即一次將全部資料取出來)這一過程是不能改變的,所以不能象真正的非同步載入樣多次從資料庫中取資料。既然不能對資料庫進行操作,就只能對取出的資料進行操作。 我的想法是:1。將取出的資料以XML檔案的形式儲存
2。在頁面上得到XML資料來源,通過唯一的欄位PID對資料進行解析,首先得到一級節點。
3。點擊由2產生的節點時,再對資料進行解析,得到該節點下的資料。
4。重複3的操作,直到沒有資料顯示為止 第一步比較好實現,因為項目中有現成的方法,直接調用就可。主要是產生PID,資料都是以1,1-1,1-1-1這種形式展示層次關係的,所以在資料載入時要知道某一節點的父節點,則應該將其父節點的ID存入該節點的PID中(即截取最後一個‘—’之前的內容),一級節點因為沒有父節點,所以PID為1。產生的的XML字串形如下。
<tree>
<tree
value="
F01" text="
aa"
id="
1-F01" pid="
1"
/>
<tree
value="
F0104" text="
bb"
id="
1-F01-04" pid="
1-F01"
/>
。。。。。。
<tree
value="
F0103" text="
cc"
id="
1-F01-03" pid="
1-F01"
/>
<tree
value="
F010101" text="
dd"
id="
1-F01-01-01" pid="
1-F01-01"
/> 。 。。。。。。 </tree>
第二步通過從後台得到的XML字串中尋找PID為1的一級節點treeDoc.selectNodes("//tree[@pid='"+selectID+"']"),再加入到樹結構中tree.add(new WebFXTreeItem(tagHidden+showName)),tagHidden為隱藏欄位存的是節點ID的值,showName有兩部分組成,一部分為單選或多選按鈕,一部分為常值內容。WebFXTreeItem方法中的sText參數可以加很多東西,這點不錯,一開始都不知CHECKBOX該怎麼加。
第三步主要是修改_p._onclick動作,得到點擊節點的PID,再從treeDoc中找到PID與之相同的節點,載入到該節點下。不過這時直接用tree.add()方法無法加進去(原因我也不知道),而是要通過一條判斷語句
if (tree.getSelected())
tree.getSelected().add(new WebFXTreeItem(tagHidden+showName));
才能載入。
第四步就無須多講拉。 由於對原代碼的執行邏輯進行拉修改,所以圖形顯示方面也要少做修改,如有子節點的以檔案夾形式顯示,無子節點的以檔案形式顯示。還有伸縮,擴充表徵圖,這些與原代碼很多地方都有聯絡,所以修改起來很麻煩。我也只對_p.getIconSrc,_p.setExpanded兩個動作進行修改。前一個是設定各節點表徵圖的,後一個是設定節點展開表徵圖的。
由於不是真正意義上的非同步載入,所以有哪位朋友實現非同步載入樹的,也可以提出來,大家共同交流。如上面說的有誤的地方也請大家指出。