Extjs 4 Tree 異步分級別加載子節點


目的:將一個文件夾下的所有文件和子文件 以樹的形式顯示在網頁中,類似於資源管理器

前台代碼

var store2 = Ext.create('Ext.data.TreeStore', {  
        proxy: { 
            type: 'ajax',  
            url: '../TreeTest.ashx'  
        },  
        fields:['id','text']//跟舊版本extjs一樣,節點的id和顯示文本  
    });  
      
    var AsyncTree2 = Ext.create("Ext.tree.Panel",{  
        title: 'Simple Tree2',  
        width:300,  
        height:300,  
        collapsible: true,  
        singleExpand: true,  
		useArrows: true,
        root: {  
            id:1,  
            text: "hehe",  
            expanded: true  
          
        },  
        store:store2,  
	    renderTo: 'tree-div',
		listeners:{
		     'beforeitemexpand':function(node,optd)
			 {
			    if(node.data.text=='總公司')
				{

                             		               }
				 else
				 {
				  // node.leaf=true
				 }
			 }
		  }
		  
		  });

});

 后台代碼

 public void ProcessRequest (HttpContext context) {
        context.Response.ContentType = "text/plain";
       // context.Request.Params["bumen"]; ;
        string id = context.Request.Params["node"];
        string result = "";
        if (id == "1")
        {
            result = "[{'text':'總公司','id':100}]";
        }
        else if (id == "100")
        {
            result = "[{'text':'分公司一','id':110,leaf:true},{'text':'分公司二','id':120}]";
        }
        else if (id == "120")
        {
            result = "[{'text':'部分一','id':1200,leaf:true},{'text':'部門二','id':1300,leaf:true}]";
        }
        context.Response.Write(result);
    }
 

 擴展,每個節點展開時,如何改變每次服務請求的URL 地址,extraParams 參數值,在beforeitemexpand事件中,調用store.setProxy()方法

listeners:{
		     'beforeitemexpand':function(node,optd)
			 {
			    if(node.data.text=='總公司')
				{
			          var tt=node.data.text;
				  var  mystore=AsyncTree2.getStore()
				//   mystore.proxy.url='../TreeTest.ashx?aa==vv' 
				//  mystore.load();
				   mystore.setProxy({
                                       type:'ajax',

                                       url:'../TreeTest11.ashx' ,
                                       extraParams:{time:tt}

                                      })

				 }
				 else
				 {
				  // node.leaf=true
				 }
			 }
		  }

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM