先上代码:
这个是home.jsp,点击导航会自动添加tab标签
Ext.BLANK_IMAGE_URL = "./extJs/resources/images/default/s.gif";
Ext.QuickTips.init();
var left;
Ext.onReady(function(){
//logo
var top = new Ext.Panel({
region:'north',
title:"logo",
height:80,
html:"这里是logo"
});
//树形菜单
left = new Ext.tree.TreePanel({
region:'west',
title:"功能导航",
collapsible:true,
split:true,
containerScroll:true,
aotuScroll:true,
width:200,
listeners:{
dblclick:function(n){
var url = n.attributes.url;
var id = n.attributes.id;
alert("url="+url+"-------id="+id);
alert(n.attributes.text);
if(url){
if(center.getItem(id)){
center.setActiveTab(id);
}else{
var p = new Ext.Panel({
title:n.attributes.text,
id:id,
autoLoad:{url:url,script:true},
closable:true
});
center.add(p);
center.setActiveTab(p);
}
}
}
}
});
var root = new Ext.tree.TreeNode({id:"1",text:"人员管理系统",leaf:"false"});
//注意这个跳转路径
var addEmp = new Ext.tree.TreeNode({text:"新增员工",url:"addEmp.jsp"});
var listEmp = new Ext.tree.TreeNode({text:"员工信息维护",url:"listEmp.jsp"});
root.appendChild([addEmp,listEmp]);
left.setRootNode(root);
//中间面板
var center = new Ext.TabPanel({
region:'center',
defaults:{aotuScroll:true},//自动出现滚动条
items:[{
title:"首页",
html:"这是首页",
id:"index"
}],
enableTabScroll:true
});
center.setActiveTab("index");
center.doLayout();
var vp = new Ext.Viewport({
layout:'border',
items:[top,left,center]
});
left.expandAll();
});
addEmp.jsp 这里我就想随便写个panel嵌套进去
Ext.onReady(function(){
new Ext.Window({
title: "窗口",
width: 400,
height: 300,
bodyStyle: "padding: 5px",
items:[
new Ext.Button({text:'新按钮'}),
new Ext.DatePicker({})
]
}).show(Ext.getBody());
});
运行的结果是:
1、在tabpanel中 不显示addEmp.jsp中的ext部分内容,无论写什么样的ext都不显示,只可以显示body中的内容,(是不是他显示了 在底下?被覆盖了?可是用firfox没用找到相应的dom。也许我没找对??.......)
2、可是 直接访问addEmp.jsp显示的是正确的。
ext tabpanel
------解决方案--------------------------------------------------------
autoLoad html iframe src url