個人感覺ztree的官方說明還是比較詳細的,有興趣的可以去看看。
ztree的節點載入方式總共有兩種:同步載入和非同步載入。初始化的過程中,同步載入就已經將所有的節點資訊載入到樹節點中,我們可以隨機獲取任意節點。資料量比較小時,可以採用同步載入,並不會影響使用者體驗。但是資料量比較大的時候,就可以採用非同步載入方式,非同步載入時需要自動提交父節點屬性的引數,獲取當前節點的下級節點資訊。也就是說,在初始化的時候,全部的樹節點只有展示出來的節點,當你直接去獲取子集節點的時候就會獲取失敗。問題來了:如果我正好是乙個資料量比較大的樹,初始化的時候我要選中樹的某個級別的某乙個節點,應該怎麼辦?(如果有哪位朋友對ztree的同步或者非同步載入樹節點有問題,可以參考官方**)
我們可以設定樹節點的載入方式為非同步,然後在初始化樹資料之前同步載入需要初始化展示的所有節點。即:在後台獲取節點的路徑,並獲取展開該節點時要獲取的所有相關子節點。這樣在初始化樹節點的時候就可以以同步的方式載入該節點,而其他的節點的資料依然是以非同步的方式請求。
該類對應樹節點的沒項資訊
private long id; //node id
private string name;//node name
private boolean isparent;//is parent node
private long pid;//parent node id
......getting......
......setting......
初始化的同步載入樹節點資訊,並以json格式返回前台。這裡省略框架、資料庫訪問步驟,以最簡單的servlet請求為例。節點路徑的獲取、所有相關子節點的獲取過程。以初始化的時候展開「0」節點,並選中「1」節點為例:我們需要找到「1」節點的父級節點,並獲取所有「1」節點的子集節點,如果有多個父級節點,迭代獲取所有即可,這裡不再贅述。
listlist = new arraylist();
list.add(new entity((long) 0, "root", true, (long) -1));
list.add(new entity((long) 1, "node1", true, (long) 0));
list.add(new entity((long) 2, "node2", true, (long) 0));
//list to jsonstr
jsonarray jsonobject = jsonarray.fromobject(list);
response.getwriter().print(jsonobject.tostring());
非同步載入節點的所有子節點,並以json格式返回前台。這裡省略框架、資料庫訪問步驟,以最簡單的servlet請求為例。
try else else if ("1".equals(id)) else if ("2".equals(id)) else if ("6".equals(id))
} //list to jsonstr
jsonarray jsonobject = jsonarray.fromobject(list);
response.getwriter().print(jsonobject);
} catch (ioexception e)
在初始化樹節點之前,獲取與要展示節點的所有相關節點資訊,並以簡單資料的方式初始化ztree樹。由於預設的樹節點載入方式為非同步載入,所以在初始化後的展開樹節點操作將以非同步載入的方式獲取所有子節點。
var setting = ,
data :
}, };
$(function()
});});
剛開始寫部落格,可能有很多不專業的地方,還請大家海涵,筆者會盡快趕上大家的腳步。另外:該文件對應的全部**見資源
非同步&同步載入樹節點----ztree(一)。
zTree非同步載入全部節點
首先,剛接觸ztree時,一直研究非同步載入時如何在前段js中配置乙個固定的根節點,可是最終失敗了,貌似ztree不支援這種做法,這點ext就比較靈活。所以,ztree做非同步載入時,第一次在後台接收id的值會為null,此時需要對齊進行手動賦值,當展開根節點,第二次傳參到後台時,接收的id就會有值...
ztree非同步載入
以前一直困惑於樹的動態載入,前幾天用了treeview,但用於非同步載入一直不太好用,弄得心力交瘁。而且treeview的api也沒有。然後今天在csdn上看到有人提到ztree,我就去下了ztree的相關檔案。不過學習也是需要過程,我差不多用了乙個上午才搞定乙個簡單的非同步載入。現在把相關的資訊記...
zTree非同步載入資料,預設展開全部節點
非同步載入tree 想要預設展開全部節點,使用普通的方法是不行的。例如 document ready function 這樣使用 expandnode 方法是不能展開非同步載入的資料的。官方demo 中 有乙個 非同步展開全部節點的 頁面 在 ztree ztree v3 2ffc0fa demo ...