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();
分享到:
相关推荐
ExtJs中Store加载(load)时候提示信息
extjs tree 异步加载树型完整的一个web工程,自已已经试过,可用。
此文件用于项目首页内容,使用了ExtJs中的GridPanel
AJAX: 以JSON数据格式,使用ExtJS构造动态异步加载的树。
Extjs动态菜单可添加子项和编辑子项,拖动保存、dwr实现存储数据。
Extjs4.2 动态加载项目(权限模块),直接下载下来即可使用,数据可自动生成。
NULL 博文链接:https://kaobian.iteye.com/blog/996146
NULL 博文链接:https://maoyi606.iteye.com/blog/1782825
中午的时候发了第一篇 Extjs4.1.x 框架搭建 采用Application动态按需加载MVC各模块 ,发现实现上还是有问题,有很多理解不到位的地方,晚上详细解决下了,终于实现MVC各模块按需加载了,哈皮。 上篇文章中,关于...
extjs实现动态树加载菜单
extjs4.0中,不想一次性加载所有的controller,特别是那种tabPanel布局的时候,一个tab的内容对应一个controller的时候。可以通过动态创建controller的方式,还能遵循mvc设计规范。这个例子完美破解,经过测试。 ...
该文件中包含了一些实例:如何加载数据到extjs
extjs4,当点击左边的树,右边会生成相应的面板,代码精简,欢迎大家来学习,有问题可以直接交流。
在使用使用FormPanel时我们通常需要使用它的form对象来加载数据或提交数据。FormPanel中的 form对象为Ext.form.BasicForm类型的对象,它有load和submit方法分别用于加载数据和提交数据。而这两个方法都是通过调用 ...
NULL 博文链接:https://firezhfox.iteye.com/blog/1885329
自己由于使用extjs3,开发了一个动态加载js的管理器,类似extjs4的使用方式,但实现方式完全不一样,有兴趣的朋友可以下载后使用,欢迎吐槽
Extjs 4.1 (MVC) 如何动态加载控制层以及session 过期该如何处理
继承,作用域等)并能熟练使用extjs框架(明确各组件间的继承关系)的人阅读,目的在于对extjs的前台架构进行性能上的优化,核心思想为:“按需索取,晚使用,晚加载晚声明;不使用,不加载不声明;经常访问使用,进行...
js代码,实现了 extjs4.x tabpanel 动态加载panel和html的功能
通过java 访问数据库而生成节点 子节点的 ID 与 父节点的关系为“父节点id_子节点id”此id为数据库中的id 同理“父节点id_子节点id_子子节点id”,因此加载树时将node.id做为参数 通过split("_"),根据数据的长度就...