ext TreePanel 一次遞歸加載數據及異步加載數據(點子節點加載數據)

 一、一次加載數據(適用於數據量較少的情況)

首先來看java端獲取數據

public String tree() throws IOException{
	JSONArray root = new JSONArray();
	 	//檢索數據庫獲取數據 select nodeid,nodename,parent_id from table    
               List<String[]> dataList = CommonService.getServiceValueList();                   	 	                       if(dataList.size()>0){ 
				if(dataList!=null&&dataList.size()>0){
					 
					for (String[] tree:dataList) {
						 							 
							Map<String, Object> map = new HashMap<String, Object>();
							map.put("id", tree[0]);
							map.put("text", tree[1]); 
							
							JSONArray child = getchild(dataList,tree);
							map.put("children", child);
							root.add(map); 
						 						
					}
				}
			}
		 
		root.toJSONObject(root);
		getResponse().setContentType("text/json; charset=utf-8");
		PrintWriter out=getResponse().getWriter();
		out.print(root);
		out.close();
		return null;
	}
 private JSONArray getchild(List<String[]> dataList,String[] tree) {
  //遞歸獲取字幾點
  JSONArray child = new JSONArray();
  for (String[] sonTree:dataList) {
   if (tree[0].equals(sonTree[2])) {
    Map childjson = new HashMap();
    childjson.put("id", sonTree[0]);
    childjson.put("text", sonTree[1]);  
    JSONArray childs = getchild(dataList,sonTree);
    if(childs.size()>0) {
     childjson.put("children", childs);
    } else {
     childjson.put("leaf", "true");
    }
    
    child.add(childjson); 
   }
  }
  
  return child;
 }


js頁面的代碼爲

 var treeload =new Ext.tree.TreeLoader({
        	dataUrl: nowurl+'path!tree.action?dyj='+new Date() 
        });
   var root = new Ext.tree.AsyncTreeNode({
            text : '業務',
            draggable : false,
            id : '-1',
            loader: treeload

      });
var tree = new Ext.tree.TreePanel({  
  height : height-10, 
        width:width/4-50,
        title:'參數分類',
        animate:true,
        enableDD:false, 
        border:false,
        autoScroll : true, 
        root:root,
  containerScroll : true 
        
       
    });

root.expand();

 

以上代碼可以一次性加載所有樹節點數據。

 

二、異步加載數據(點子節點加載數據)

 

適用於數據量比較大的時候,希望點擊子節點時再去檢索數據

 

還是先看看java代碼

public String tree() throws IOException{
		JSONArray root = new JSONArray();
	 	   //這裏有變化哦 select nodeid,nodename from table where parentid=?
		List<String[]> dataList = CommonService.getServiceValueList(parent_id);
			if(dataList.size()>0){ 
				if(dataList!=null&&dataList.size()>0){
					 
					for (String[] tree:dataList) {
							 
							Map<String, Object> map = new HashMap<String, Object>();
							map.put("id", tree[0]);
							map.put("text", tree[1]);                         
  //是否有子節點
                       List<String[]> subdata = CommonService.getServiceValueList(tree[0], "");
       if(subdata==null || subdata.size()==0) {
        map.put("leaf", "true");
       }
//							map.put("children", child);  這句話一定不能要哦
							root.add(map); 
						
					}
				}
			}
		 
		root.toJSONObject(root);
		getResponse().setContentType("text/json; charset=utf-8");
		PrintWriter out=getResponse().getWriter();
		out.print(root);
		out.close();
		return null;
	}


再看看js吧,只要修改一處並且加上'beforeload'處理就可以了

 var treeload =new Ext.tree.TreeLoader({
        	dataUrl: nowurl+'path/tree!tree.action?service_name=LATNEVENTTREE&parentid=-1&dyj='+new Date() //加 參數了
        });
tree.on('beforeload', function(node){
     
     treeload.dataUrl =nowurl+'path/tree!tree.action?parentid='+node.id+'&dyj='+new Date();
  
    });


 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章