extjs 如何通过点击a.jsp内的树,来控制其中嵌套的b.jsp中tabpanel的activeTab选中0或者1、2、3???
这是a.jsp中的代码varpn1=Ext.create('Ext.panel.Panel',{region:"center",id:'pn1',layout:'fit'...
这是 a.jsp中的代码
var pn1=Ext.create('Ext.panel.Panel',{
region : "center",
id:'pn1',
layout : 'fit',
frame : true,
resizeTabs : true,
autoScroll : false,
closable : true,
html : '<iframe src="b.jsp" frameborder="0" scrolling="yes" id="setframe" name="setframe" width="100%" height="100%"></iframe>',
border:false
});
b.jsp中只有一个tabpanel,如何在a中控制b的activeTab 展开
var pn1=Ext.create('Ext.panel.Panel',{
region : "center",
id:'pn1',
layout : 'fit',
frame : true,
resizeTabs : true,
autoScroll : false,
closable : true,
html : '<iframe src="b.jsp" frameborder="0" scrolling="yes" id="setframe" name="setframe" width="100%" height="100%"></iframe>',
border:false
});
b.jsp中只有一个tabpanel,如何在a中控制b的activeTab 展开
2个回答
展开全部
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
<script type="text/javascript">
Ext.onReady(function() {
var windowWidth = 1000;
var windowHeight = 500;
var tree = new Ext.tree.TreePanel( {
region : "west",
width : windowWidth / 6,
height : windowHeight,
title : "test",
root : new Ext.tree.AsyncTreeNode( {
text : "all",
children : [ {
text : "aaa",
leaf : true
}, {
text : "bbb",
leaf : true
}, {
text : "ccc",
leaf : true
} ]
}),
autoScroll : true,
animate : true,
lines : false,
collapseMode : "mini",
collapsible : true,
margins : '0 0 2 2',
cmargins : '0 5 2 2',
layoutConfig : {
animate : true
},
split : true,
border : true,
minSize : windowWidth / 6,
maxSize : windowWidth / 6,
listeners : {
click : function(n) {
if (n.leaf) {
showTab_addPanel( {
id : n.id,
name : n.text
});
}
}
}
});
function showTab_addPanel(obj) {
var objId = obj.id;
var name = obj.name;
var itemPanel = tabPanel.getItem(objId);
if (itemPanel) {
tabPanel.setActiveTab(itemPanel);
} else {
// 在这里可以写点变量,然后在下面拼接src实现点击动态生成嵌套的页面
var tb = new Ext.Panel(
{
title : name,
id : objId,
layout : 'fit',
items : [ new Ext.Panel(
{
closable : "true",
region : "center",
layout : 'fit',
frame : true,
resizeTabs : true,
autoScroll : true,
html : '<iframe scrolling="auto" frameborder="0" width="100%" height="100%" src=http://www.hao123.com></iframe>'}) ],
closable : true,
listeners : {
beforeclose : function(p) {
p.setVisible(false);
},
beforedestroy : function() {
return false;
}
}
});
tabPanel.add(tb);
tabPanel.setActiveTab(tb);
}
}
var tabPanel = new Ext.TabPanel(
{
region : "center",
resizeTabs : true,
items : []
})
var emPanel = new Ext.Panel( {
width : windowWidth - 15,
height : windowHeight - 60,
layout : "border",
border : true,
items : [ tabPanel, tree ]
});
var windowWidth = window.screen.availWidth;
var style = 'margin-top:150px;margin-left:150px;';
var el = Ext.get('auto-center').applyStyles(style);
emPanel.render(el);
});
</script>
</head>
<body>
<div id='auto-center'></div>
</body>
</html>
给你发的就是个html页面,把代码考出来,粘到txt上,然后保存成test.html就行。
然后你就自己把extjs核心包和css改成你那个包所在的路径就行,extjs3.0的。
或者你就直接放ext的那个文件夹同级目录下就行。
或者,你直接粘js代码
html : '<iframe scrolling="auto" frameborder="0" width="100%" height="100%" src=b.jsp></iframe>'这个位置换成你的b.jsp就行了
追问
…………你回答过上次提过的问题…………贴了一样的代码…………但是…………这次的问题不是嵌套的事情啊……tabpanel是已经存在在b.jsp里了,所有tab的数据都做好放在b.jsp了
追答
额,嘿嘿,这样~~~
给b.jsp传参,b.jsp?a='1' 像这样,然后b.jsp里去根据传参,激活b.jsp里的TabPanel。
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询