`
zjnbshifox
  • 浏览: 312790 次
  • 性别: Icon_minigender_1
  • 来自: 宁波
社区版块
存档分类
最新评论

Extjs按需加载的问题

阅读更多
Extjs在使用accordion layout,总共分2个页签,每个页签都有一棵树
layout:'accordion',  
                 layoutConfig:{  
                     animate:true,
                     hideCollapseTool:true
                 },  
                 items: [{  
                     title:'导航',  
                     autoScroll:true,  
                     border:false,  
                     iconCls:'nav',  
                     html:'<div id="nav-tree" style="overflow:auto;height:400px;border:0px solid c3daf9;"></div>'
                    }  
                 ,{  
                     title:'用户设置',  
                     html: '<div id="set-tree" style="overflow:auto;height:400px;border:0px solid c3daf9;"></div>',  
                     border:false,  
                     autoScroll:true,  
                     iconCls:'settings'  
                 }]  、


//树~~~
var navtree;
		var settree;
		var sroot;
		var root;
		if(!navtree){  
	        navtree = buildTree('nav-tree');
	        root = new Ext.tree.AsyncTreeNode({  
		         text: '导航菜单',  
		         draggable:false,  
		         id:'nroot'  
		     });  
		    navtree.setRootNode(root);
	        root.appendChild(new Ext.tree.TreeNode({text:"按钮"}));
	        navtree.render();  
     		root.expand(); 
        };
        
        if(!settree){
        	settree = buildTree('set-tree');
        	sroot = new Ext.tree.AsyncTreeNode({  
		         text: '设置菜单',  
		         draggable:false,  
		         id:'sroot'  
		     });  
		    settree.setRootNode(sroot);
	        sroot.appendChild(new Ext.tree.TreeNode({text:"按钮"}));
	        settree.render();
	        sroot.expand(); 
	        settree.show();	
     		      	
        };

       function buildTree(divid){
       		 var tree = new Ext.tree.TreePanel({  
		         el:divid, 
		         //applyTo:divid, 
		         autoScroll:true,		           
		         animate:true,  
		         border:false,  
		         enableDD:true,  
		         containerScroll: true,
		         lines:false, 
		         autoShow:true,
		         rootVisible:false});
		     return tree;
       };

现在的问题是,第一棵树可以显示,第二页上的树不能显示,用firebug调试的时候,设置断点,在第二棵树显示之前用鼠标切换到第二页签,树能够正常显示?我感觉是extjs的按需加载的问题,
有什么办法能让这2棵树同时显示??
现在暂时的解决办法是,第二棵树使用另外的方式构造,代码如下:
 if(!settree){
        	settree = new Ext.tree.TreePanel({  
		         autoShow:true,
		         autoScroll:true,		           
		         animate:true,  
		         border:false,  
		         enableDD:true,  
		         containerScroll: true,
		         lines:false, 
		         autoShow:true,
		         rootVisible:false})     	
        };
        sroot = new Ext.tree.AsyncTreeNode({  
		         text: '设置菜单',  
		         draggable:false,  
		         id:'sroot'  
		});
        settree.setRootNode(sroot);
	    sroot.appendChild(new Ext.tree.TreeNode({text:"按钮"}));
	    settree.render(Ext.get('set-tree'));
	    settree.expandAll(); 
分享到:
评论
1 楼 kooyeed 2008-02-24  
我根的效果一样,不过数据是通过jsonReader过来的,问题是:
FF下没问题,IE下总有一个抽屉是空白的,郁闷。。。

相关推荐

Global site tag (gtag.js) - Google Analytics