当我点击左边的树的时候 在右边的center区的tabPanel 不显示 list.jsp中的 editorPanel 单独点击list.jsp时一切正常能够显示 但是当 点击treePanel节点时 能找到路径 jsp输出一句话能显示 就是不显示 editorPanel 这个表格========================================下面是代码===========================================================
var left = new Ext.tree.TreePanel({
region:'west',//西边
collapsible:true,
title:"我的管理系统",
width:200,
autoScroll:true,
split:true,
listeners:{
click:function(n){
var url = n.attributes.url;
var id = n.attributes.id;//如果没有id自动创建一个id
var p = center.getItem(id);//获得节点id对应的标签面板
if(url){
if(p){
//如果已经存在 则激活
center.setActiveTab(p);
}else{
//如果不存在 则创建新的并激活
p = new Ext.Panel({
title:n.attributes.text,
autoLoad:{url:url,scripts:true},
closable:true,//标签上出现的关闭按钮
id:id
});
center.add(p);
center.setActiveTab(p);
}
}
}
}
});
//定义根节点
var root = new Ext.tree.TreeNode({
text:"我的管理信息"
});
var child1 = new Ext.tree.TreeNode({
text:"商品管理",
url:"list.jsp"
});
var left = new Ext.tree.TreePanel({
region:'west',//西边
collapsible:true,
title:"我的管理系统",
width:200,
autoScroll:true,
split:true,
listeners:{
click:function(n){
var url = n.attributes.url;
var id = n.attributes.id;//如果没有id自动创建一个id
var p = center.getItem(id);//获得节点id对应的标签面板
if(url){
if(p){
//如果已经存在 则激活
center.setActiveTab(p);
}else{
//如果不存在 则创建新的并激活
p = new Ext.Panel({
title:n.attributes.text,
autoLoad:{url:url,scripts:true},
closable:true,//标签上出现的关闭按钮
id:id
});
center.add(p);
center.setActiveTab(p);
}
}
}
}
});
//定义根节点
var root = new Ext.tree.TreeNode({
text:"我的管理信息"
});
var child1 = new Ext.tree.TreeNode({
text:"商品管理",
url:"list.jsp"
});
就这些 js如何 deg 跟中
//定义树的跟节点
var root=new Ext.tree.TreeNode({
id:"root",//根节点id
text:"运营商管理",
draggable : false,
expanded:true
});
//定义节点
var node1=new Ext.tree.TreeNode({
id:'c1',//子结点id
text:'商品信息维护',
listeners:{
'click':function(node, event) {
event.stopEvent();
var n = centerPanel.getComponent(node.id);
if (!n) { //判断是否已经打开该面板
n = centerPanel.add({
'id':node.id,
'title':node.text,
'layout': 'fit',
'containerScroll':true,
'autoScroll':true,
'autoShow':true,
'closable':true, //通过html载入目标页
'html':'<iframe scrolling="auto" frameborder="0" leftmargin="0" ' +
'topmargin="0" marginwidth="0" marginheight="0" width="100%" height="100%"' +
'src="productsMng.jsp" />'
});
}
centerPanel.setActiveTab(n);
}
}
});
var node2=new Ext.tree.TreeNode({
id:'c2',
text:'商家管理',
listeners:{
'click':function(node, event) {
event.stopEvent();
var n = centerPanel.getComponent(node.id);
if (!n) { //判断是否已经打开该面板
n = centerPanel.add({
'id':node.id,
'title':node.text,
'layout': 'fit',
'containerScroll':true,
'autoScroll':true,
'autoShow':true,
'closable':true, //通过html载入目标页
'html':'<iframe scrolling="auto" frameborder="0" leftmargin="0" ' +
'topmargin="0" marginwidth="0" marginheight="0" width="100%" height="100%"' +
'src="businessMng.jsp" />'
});
}
centerPanel.setActiveTab(n);
}
}
});
var node3=new Ext.tree.TreeNode({
id:'c3',
text:'终端用户管理',
listeners:{
'click':function(node, event) {
event.stopEvent();
var n = centerPanel.getComponent(node.id);
if (!n) { //判断是否已经打开该面板
n = centerPanel.add({
'id':node.id,
'title':node.text,
'layout': 'fit',
'containerScroll':true,
'autoScroll':true,
'autoShow':true,
'closable':true, //通过html载入目标页
'html':'<iframe scrolling="auto" frameborder="0" leftmargin="0" ' +
'topmargin="0" marginwidth="0" marginheight="0" width="100%" height="100%"' +
'src="endUserMng.jsp" />'
});
}
centerPanel.setActiveTab(n);
}
}
});
//为根节点增加子结点c1
root.appendChild(node1);
root.appendChild(node2);
root.appendChild(node3);
//生成树形面板
var tree=new Ext.tree.TreePanel({
root:root,//定位到根节点
animate:true,//开启动画效果
enableDD:false,//不允许子节点拖动
border:false,//没有边框
expanded:true,//展开
autoScroll:true,
lines:true,//节点间的虚线条
frame: false,// 美化界面
rootVisible:true,//是否显示根节点
collapsible:false,//可折叠
containerScroll: true,//否支持滚动条
enableDD:true,//不仅可以拖动,还可以通过Drag改变节点的层次结构
enableDrag:true,//树的节点可以拖动Drag
trackMouseOver:false,//false则mouseover无效果
useArrows:true,//小箭头
trackMouseOver:true, //mouseover效果
singleExpand:true,//用单击事件展开,默认为双击
border:false, //边框
useArrows:true
});
//center
var centerPanel = new Ext.TabPanel({
id : 'centerPage',
region:"center",
border:false, //边框
resizeTabs:false,
deferredRender:false,
tabWidth:60,
autoTabs:true,
maskDisabled:true,//对面板进行遮罩
monitorResize:true,//按照浏览器的大小渲染布局
animCollapse:true,//面板闭合过程附动画效果
autoShow:true,//检测是有否隐藏的样式类
activeTab: 0,
defaults:{autoScroll:true},
items:[{
id:"homePage",
title:"首页",
layout : 'border',
border : false,
items : [{
region:"center",
html :''
// '<img src = "pic/welpage1.jpg" />'
}]
}]
});
//topPanel
var topPanel = new Ext.Panel({
region: 'center',
layout : 'column',
border : false,
items : [{
columnWidth : 0.7,
border : false,
layout : 'form',
html : '<center><font size = "48">SNS</font></center>'
},{
columnWidth : 0.3,
buttonAlign : 'center',
border : false,
layout : 'form',
html: '<br>当前用户：'+username+'<br><br><a href="/mgnportal/index.jsp">注销</a>'
}]
});
var viewport = new Ext.Viewport({
layout : 'border',
border : false,
autoScroll:true,
autoHeight:true,
defaults: {
collapsible: true
},
viewConfig: {
forceFit: true
},
items : [
{
id : 'westp',
title : '导航菜单',
collapsible : true, // 面板可以折叠
region : 'west',
iconCls:'nav',
autoScroll:true,
border:false,
width : 200,
items : [tree]
}, {
region : 'north',
height : 100,
items : [topPanel],
layout : 'border',
border : false
}, {
region: 'center',
id : 'center',
margins:'0 5 5 5',
collapsible: false,
layout: 'fit',
border : false,
items:[{
layout : 'border',
border : false,
items:[centerPanel]
}]
}]
});