關於非同步載入樹的討論

來源:互聯網
上載者: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兩個動作進行修改。前一個是設定各節點表徵圖的,後一個是設定節點展開表徵圖的。
    由於不是真正意義上的非同步載入,所以有哪位朋友實現非同步載入樹的,也可以提出來,大家共同交流。如上面說的有誤的地方也請大家指出。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.