欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Jquery zTree 樹控件異步加載操作

 更新時間：2016年02月25日 10:58:55   投稿：lijiao  
這篇文章主要介紹了Jquery zTree 樹控件異步加載操作，學(xué)習(xí)Jquery zTree異步加載，zTree實現(xiàn)一套能完成大部分常用功能的 Tree插件，感興趣的小伙伴們可以參考一下

zTree 是利用 JQuery 的核心代碼，實現(xiàn)一套能完成大部分常用功能的 Tree 插件

  • 兼容 IE、FireFox、Chrome 等瀏覽器
  • 在一個頁面內(nèi)可同時生成多個 Tree 實例
  • 支持 JSON 數(shù)據(jù)
  • 支持一次性靜態(tài)生成 和 Ajax 異步加載 兩種方式
  • 支持多種事件響應(yīng)及反饋
  • 支持 Tree 的節(jié)點移動、編輯、刪除
  • 支持任意更換皮膚 / 個性化圖標(biāo)（依靠css）
  • 支持極其靈活的 checkbox 或 radio 選擇功能
  • 簡單的參數(shù)配置實現(xiàn) 靈活多變的功能

異步加載的意思就是： 當(dāng)點擊展開樹節(jié)點時，才去請求后臺action返回點擊節(jié)點的子節(jié)點數(shù)據(jù)并加載。

這里面主要設(shè)計ztree的setting變量的async屬性設(shè)置：

var setting = {
 async: {
  enable: true,
  url:InitServiceIpsData.action,
  autoParam:[id, name],
  dataFilter: filter 
 },

當(dāng)點擊展開樹節(jié)點時，會請求url指定的action獲取子節(jié)點數(shù)據(jù)，然后綁定到ztree上。

注意這里后臺action返回的是JSON字符串，而ztree綁定新的節(jié)點數(shù)據(jù)只接收數(shù)組，所以需要在綁定前用filter函數(shù)進(jìn)行數(shù)據(jù)清洗轉(zhuǎn)換操作，將字符串轉(zhuǎn)換為數(shù)組：

//過濾異步加載ztree時返回的數(shù)據(jù) 
 function filter(treeId, parentNode, childNodes) {
 if (!childNodes) 
  return null; 
 childNodes = eval((+childNodes+)); //必須轉(zhuǎn)換為[{id:103,pId:1,name:'子節(jié)點3'}];這樣的格式 
 return childNodes;
 }

這樣點擊展開ztree樹節(jié)點時，就會請求action獲取子節(jié)點數(shù)據(jù)并綁定了。 

下面是后臺action的一個實現(xiàn)：

public String InitServiceIpsData()
 {
 HttpServletRequest request = ServletActionContext.getRequest();
 String id = request.getParameter(id);
 String name = request.getParameter(name);
 System.out.println(請求獲取+name+的ip列表);
  
 List<hashmap<string,object>> list = new ArrayList<hashmap<string,object>>();  
 for(int i = 1; i <= 2; i++){ 
  HashMap<string,object> hm = new HashMap<string,object>();  
  hm.put(id, id + 0 + i);
  hm.put(pId, id);
  hm.put(name, name + _IP_ + i);
  hm.put(isParent, false);
  list.add(hm);
 } 
  
 JSONArray finalJson = JSONArray.fromObject(list);
 this.initServiceIpsData = finalJson.toString();
 return SUCCESS;
 }</string,object></string,object></hashmap<string,object></hashmap<string,object>

更多關(guān)于ztree控件的內(nèi)容，請參考專題《jQuery插件ztree使用匯總》

以上就是Jquery zTree 樹控件實現(xiàn)異步加載操作的詳細(xì)步驟，希望對大家的學(xué)習(xí)有所幫助。

相關(guān)文章

最新評論