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
				 }
			 }
		  }

 

posted on 2013-05-16 15:19  markygis  阅读(4610)  评论(0编辑  收藏  举报