Question

Ext TabPanel 动态添加item的问题

var mainTab = new Ext.TabPanel({
renderTo:'main-div',
activeTab:0,
height:600,
enableTabScroll:true,
deferredRender: false,
layoutOnTabChange: true,
resizeTabs:true,
items:[
{
id:'main',
title:'首页',
html:'<iframe id="main" name="main" src="welcomeListAction!getNew.do" width="100%" height="100%" frameborder="0" scrolling="auto"></iframe>',
closable: true
}
]
});
function addtab(myid,mytitle,myurl){
var panel=new Ext.Panel({
id:myid,
title:mytitle,
html:'<iframe id="main1" name="main1" src="yearBaseListAction!getList.do" width="100%" height="100%" frameborder="0" scrolling="auto"></iframe>',
closable:true
});
mainTab.add(panel).show();
}
下边还有代码是响应click事件，调取addtab方法，但是这个新添加的tab不显示，调取mainTab.item.length显示数量已经增加了，怎么样设置能显示呢？

Answer 1

这样写 你可以用firefox调试一下

function addtab(myid,mytitle,myurl) {
var tab = Ext.getCmp(myid);
if (!tab) {
mainTab.add({
id :myid,
title : mytitle,
closable : true,
layout : 'fit',
html:'<iframe id="main1" name="main1" src="yearBaseListAction!getList.do" width="100%" height="100%" frameborder="0" scrolling="auto"></iframe>'
});
}
mainTab.setActiveTab(node.attributes.id);
}

Answer 2

你在使用了add的时候，不用再show，你可以直接tab.setActiveTab(panel).并且把layoutOnTabchang,resizeTab,deferedRender这些配置项去了，试试。

Answer 3

yearBaseListAction!getList.do 跳转页面了么？