Ext的TabPanel打开的两个tab之间js内容错乱
问题描述:
[code="java"]
Ext.onReady(function(){
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
var viewport = new Ext.Viewport({
layout:'border',
items:[
mainTabpanel, //将欢迎界面放入到ViewPort
{
region:'west',
id:'west-panel',
title:'导航菜单',
split:true,
width: 200,
minSize: 175,
maxSize: 400,
collapsible: true,
margins:'0 0 0 5',
layout:'accordion',
layoutConfig:{
animate:true
},
items: [{
//contentEl: 'west',
title:'发票系统',
autoLoad : {
url:'/ExtDemo/demo/tree.jsp',
scripts:true
},
border:false,
iconCls:'nav'
},{
title:'消息系统',
autoLoad : {
url:'/ExtDemo/demo/tree.jsp',
scripts:true
},
border:false,
iconCls:'nav'
},{
title:'多业务系统',
autoLoad : {
url:'/ExtDemo/demo/tree.jsp',
scripts:true
},
border:false,
iconCls:'nav'
},{
title:'日志系统',
autoLoad : {
url:'/ExtDemo/demo/tree.jsp',
scripts:true
},
border:false,
iconCls:'nav'
}
]
}
]
});
});
var mainTabpanel = new Ext.TabPanel({
id : 'MainTabPanel',
region : "center",
enableTabScroll: true,
animate : true,
frame:true,
activeTab : "0",
items : [{
xtype : "panel",
title : "欢迎"
}]
}); //这里我定义一个欢迎的主页面,并且不能被关闭
function addtab(id, link, name) { //这里我定义一个方法,是在节点单击的时候触发这个方法,
var tabId = "tab-" + id;
var tabTitle = name;
var tabLink = link;
currentPage = tabId;
var centerpanel = Ext.getCmp('MainTabPanel');
var tab = centerpanel.getComponent(tabId);
var subMainId = 'tab-' + id + '-main';
if (!tab) { //判断MainTabPanel中是否存在这个页面,如果不存在
tab = centerpanel.add(new Ext.Panel({
id : tabId,
title : tabTitle,
autoScroll : true,
iconCls : 'tabIconCss',
layout : 'fit', //layout一定要是fit,不然显示grid会有问题。
border : false,
tools : [{id:'refresh'}],
closable : true
}));
centerpanel.setActiveTab(tab); //将焦点指向我点击节点打开的页面
tab.load({
url : tabLink, //指向我传过来的页面的位置
method:"post",
params : {
// 这里是关键的一个参数,传给load页,布局的关键
subMainId : subMainId
},
scope : this,
discardUrl : true,
nocache : true,
text : "页面加载中,请稍候……",
timeout : 9000,
scripts : true
});
} else { //如果MainTabPanel,那么就直接将节点指向这个页面
centerpanel.setActiveTab(tab);
}
}
[/code]
问题一:4个主菜单的url内容全部显示在了第一个主菜单里面。(见图一)
问题二:点击菜单时能在右侧center区域显示相应内容,但是所有的js相关内容都会显示在第一个打开的tab页面,而非js内容则能显示在对应的tab里面。(见图一、图二)
附:图一中的那个表格是子节点1所链接的内容,图二中的数字也是子节点1的,而图一中右侧的菜单是子节点2的,现在他们全都显示在子节点2中,但是非js的数字却在子节点1里面。
请教大家是怎么回事?
答
把各个tabpanel所使用的js,css移到 导航页面去 试一试