树与accordion

ExtJS布局与树组件示例

最新推荐文章于 2024-09-05 10:09:50 发布

原创最新推荐文章于 2024-09-05 10:09:50 发布 · 137 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#EXT #HTML

javascript 专栏收录该内容

4 篇文章

订阅专栏

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 = 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(); 

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

转自：http://www.iteye.com/topic/163280