Ext treeLoader 同步、异步加载树 问题

from:http://blog.sina.com.cn/s/blog_51777ce90100ia9v.html



1.tree的异步加载：



前台代码：

Ext.onReady(function(){

Ext.BLANK_IMAGE_URL="/commons/extjs2.1/extjs/resources/images/default/s.gif";



var root= new Ext.tree.AsyncTreeNode( { id:'1', text: '我是树根' } );

var loader= new Ext.tree.TreeLoader( {dataUrl: 'aa.jsp'});

var treePanel;

treePanel= new Ext.tree.TreePanel( {

renderTo: 'tree',

root: root,

loader: loader

} );



loader.on('beforeload',function(loader,node){



this.baseParams.id=node.id; //通过这个传递参数，这样就可以点一个节点出来它的子节点来实现异步加载



},loader);



});





后台代码：aa.jsp



<%

String id= request.getParameter("id");

if(id.equals("1")){

out.println("[{text: '1节点', id: '2'},{text: '2子叶', leaf: true, id: 'node2'}]");

}else if(id.equals("2")){

out.println("[{text: '1_1子叶', leaf: true,id: 'node1_1'}]");

}

%>





2.同步加载树，将所有的树的信息以json语句都返回并加载到 tree上，不用点一个节点去访问以下后台



前台代码：

Ext.onReady(function(){

Ext.BLANK_IMAGE_URL="/commons/extjs2.1/extjs/resources/images/default/s.gif";



var root= new Ext.tree.AsyncTreeNode( { id:'1', text: '我是树根' } );

var loader= new Ext.tree.TreeLoader( {dataUrl: 'bb.jsp'});

var treePanel;

treePanel= new Ext.tree.TreePanel( {

renderTo: 'tree',

root: root,

loader: loader

} );

});





后台代码：bb.jsp

<%



out.println("[{text: '1节点', id: '2',children: [{text: '1_1子叶',id: 'node1_1',children:[{text: '1_1子叶', leaf: true,id: 'node1_12'}]},{text: '1_2子叶', leaf: true,id: 'node1_2'} ] },{text: '2子叶', leaf: true, id: 'node2'}]");

%>





注意：个人感觉用异步加载好，因为这样不浪费资源，需要查看什么节点从后台获取节点数据显示，而同步加载不管需不需要看，都会将所有节点都返回



遇到的问题：当使用同步加载后，例如删除了node这个节点（非root节点）下的某个子节点，想要刷新该节点node并重新展开该节点时，不知道怎么办，



方法1：行不通

使用 loader.load(node, function() {

node.expand(true, true);

})

但是此方法行不通，因为同步树加载时已经将所有的节点都返回并加载到了root上，再使用loader.load并不会再次访问 bb.jsp，如果将loader.load(node)换成loader.load(root)时就可以访问bb.jsp，看方法2，方法3



方法2：行不通

使用



loader.load(root, function(){



node.expand(true, true);//node为想要刷新的节点，因为重新加载root后，如果root不展开，node数据时找不到的

})

当loader.load(root)时，可以再次访问bb.jsp，但是node.expand(true, true)却会报错，因为这个时候root并没有展开，它找不到深藏的node节点





方法3: 可以试试，我自己试了可以行得通



使用



var path= node.getPath();

loader.load(root, function(){

treePanel.expandPath(path); //这样就可以展开node了



})



注意：异步加载不会出现这样的问题，例如想要重新加载node，就可以使用

loader.load(node, function() {

node.expand(true, true);

})