一个关于Extjs TabPanel选项卡关闭在打开的问题，请高手帮忙解决下。比分析下原因。谢谢

Question

我创建了一个TabPanel，比动态的给它添加tabs选项卡，每个选项卡上我一个关闭按钮。当我点这个关闭按钮关闭当前选项卡。然后在打开时，上面的内容就不显示了。我设置了CloseAction:'hide',也不起作用。在TabPanel属性中设置autoDistory:false,这时关闭在点开，我的TabPanel的布局活动的选项卡上会多加个空的panel。而且我点开的那个选项卡上也会增加一个空白的，请高手帮忙解决下。比分析下原因。谢谢 // 为属性菜单节点添加click事件
treeall.on('click', function(node) {
var nodeid = node.id;
var nodeText = node.text;
var items=tabs.getComponent(nodeid);
if (nodeid == 'cpfb') { // 设置活动的产品发布面板
if (tabs.getItem(nodeid)) {
tabs.setActiveTab(nodeid);
} else {
items = tabs.add({
title : nodeText,
closable : true,
region : 'center',
layout : 'fit',
iconCls : 'chart_bar',
id : nodeid,
closeAction : 'hide',
frame : true,
activeTab : nodeText,
height : 900,
style : 'padding:0px',
items : cpfb_tabpanel

});
tabs.setActiveTab(items);// 设置为活动面板
tabs.doLayout();   // 重新计算布局
}

}

Answer 1

closeAction : 'hide' 是隐藏，但还是在页面中
再次打开时页面中已经有一个id为nodeid的tab页，此时有冲突
解决方法：
1.去掉id属性
2.单击树节点时判断有无此id的tab页。有的话移除，可以用组件的destroy()方法销毁。

Answer 2

参考写法：click: function(node, e) {
                            var tabpanel = win.get(1).get(0);
                            var n = tabpanel.getComponent(node.id);
                            if (!n) {
                                n = tabpanel.add({
                                    id: node.id,
                                    title: node.text,
                                    closable: true,
                                    html:""
                                });
                                tabpanel.setActiveTab(n);
                            } else {
                                tabpanel.setActiveTab(n);
                            }
                        }

Answer 3

报getPositionEL().dom.parentNode is null or not object的错

Answer 4

// 布局左边树形菜单
/** *************************************** */
var treeall = new Ext.tree.TreePanel({
id : 'xicd',
border : false,
expanded : true,
collapsible : false,
rootVisible : false,
autoScroll : true,
useArrows : true,
animate : true,
enableDD : true,
loader : new Ext.tree.TreeLoader({
dataUrl : '../public/script/main/allView.json' }),
root : new Ext.tree.AsyncTreeNode(),
listeners : {
'render' : function() {
Ext.getCmp('xicd').getRootNode().expand(true, true);
}
}
});
/** *************************************** */ // 程序开始时右边显示的tabPanel
var tabs = new Ext.TabPanel({
activeTab : 0,
frame : true,
autoScroll : true,
activeItem : 0,
// 如果Tab过多会出现滚动条
enableTabScroll : true,
// 加载时渲染所有
// deferredRender:false,
layoutOnTabChange : true,
autoDestroy: true,
border : false,
items : [{
title : '首页',
xtype : 'panel',
frame : true,
layout : 'fit',
iconCls : 'home',
items : cpms == null ? zbxx : wel_panel
// //
// 判断是不是第一次登录，如果是第一次登录就显示zbxx，或者就显示welcome
}],
plugins : new Ext.ux.TabCloseMenu()
})
// 为属性菜单节点添加click事件
treeall.on('click', function(node) {
var nodeid = node.id;
var nodeText = node.text;
var items=tabs.getComponent(nodeid);
if (nodeid == 'cpfb') { // 设置活动的产品发布面板
if(!items){
items = tabs.add({
title : nodeText,
closable : true,
region : 'center',
layout : 'fit',
iconCls : 'chart_bar',
id : nodeid,
closeAction : 'hide',
frame : true,
activeTab : nodeText,
height : 900,
style : 'padding:0px',
items : cpfb_tabpanel

});
tabs.setActiveTab(items);// 设置为活动面板
tabs.doLayout();   // 重新计算布局
}else{
tabs.setActiveTab(items);
}
} else if (nodeid == 'xwfb') { // 设置活动的新闻发布面板
if (tabs.getItem('xwfb_tab')) {
tabs.setActiveTab('xwfb_tab');
tabs.doLayout();   // 重新计算布局
} else {
items = tabs.add({
title : nodeText,
frame : true,
closable : true,
//closeAction : 'hide',
iconCls : 'newspaper',
region : 'center',
id : 'xwfb_tab',
layout : 'fit',
activeTab : nodeText,
items : win_xwfb
});
tabs.setActiveTab(items);// 设置为活动面板
tabs.doLayout();   // 重新计算布局

} } else if (nodeid == 'jzpm') { // 设置活动的竞价排名面板
if (tabs.getItem(nodeid)) {
tabs.setActiveTab(nodeid);
} else {
items = tabs.add({
title : nodeText,
frame : true,
id : nodeid,
closable : true,
iconCls : 'rosette',
closeAction : 'hide',
layout : 'fit',
activeTab : nodeText,
items : jjpm_tab
});
tabs.setActiveTab(items);// 设置为活动面板
tabs.doLayout();   // 重新计算布局
} } else if (nodeid == 'cptj') { // 设置活动的产品推荐面板
if (tabs.getItem(nodeid)) {
tabs.setActiveTab(nodeid);
} else {
items = tabs.add({
title : nodeText,
frame : true,
closable : true,
id : nodeid,
iconCls : 'arrow_join',
closeAction : 'hide',
layout : 'fit',
activeTab : nodeText,
items : cptj_tabpanel
});
tabs.setActiveTab(items);// 设置为活动面板
tabs.doLayout();   // 重新计算布局
} } else if (nodeid == 'qykz') { // 设置企业快照面板
if (tabs.getItem(nodeid)) {
tabs.setActiveTab(nodeid);
} else {
if (hydj == 1) {
Ext.MessageBox.alert('系统提示!', '你当前是铜牌会员没有权限操作，请升级会员等级')
} else {
items = tabs.add({
title : nodeText,
frame : true,
closable : true,
id : nodeid,
iconCls : 'arrow_join',
layout : 'fit',
activeTab : nodeText,
closeAction : 'hide',
items : win_qykz
});
}
tabs.setActiveTab(items);// 设置为活动面板
tabs.doLayout();   // 重新计算布局
} } else if (nodeid == 'logo') { // 设置活动的Logo设置面板
if (tabs.getItem(nodeid)) {
tabs.setActiveTab(nodeid);
} else {
items = tabs.add({
title : nodeText,
frame : true,
closable : true,
iconCls : 'lightbulb_off',
id : nodeid,
activeTab : nodeText,
closeAction : 'hide',
items : Logo_panel
});
tabs.setActiveTab(items);// 设置为活动面板
tabs.doLayout();   // 重新计算布局
} } else if (nodeid == 'ggsz') { // 设置活动的广告设置面板
if (tabs.getItem(nodeid)) {
tabs.setActiveTab(nodeid);
} else {
items = tabs.add({
title : nodeText,
frame : true,
closable : true,
id : nodeid,
iconCls : 'wrench',
layout : 'fit',
activeTab : nodeText,
closeAction : 'hide',
items : ggsz_panel
});
tabs.setActiveTab(items);// 设置为活动面板
tabs.doLayout();   // 重新计算布局
} } else if (nodeid == 'fgxz') { // 设置活动的风格设置面板
if (tabs.getItem(nodeid)) {
tabs.setActiveTab(nodeid);
} else {
items = tabs.add({
title : nodeText,
id : nodeid,
closeAction : 'hide',
frame : true,
closable : true,
layout : 'fit',
iconCls : 'comments',
activeTab : nodeText,
items : []
});
tabs.setActiveTab(items);// 设置为活动面板
tabs.doLayout();   // 重新计算布局
}
} else if (nodeid == 'zpxx') { // 设置活动的招聘信息面板
if (tabs.getItem(nodeid)) {
tabs.setActiveTab(nodeid);
} else {
items = tabs.add({
title : nodeText,
frame : true,
id : nodeid,
closable : true,
iconCls : 'shape_square_key',
layout : 'fit',
activeTab : nodeText,
closeAction : 'hide',
items : []
});
tabs.setActiveTab(items);// 设置为活动面板
   tabs.doLayout();   // 重新计算布局
}
} else if (nodeid == 'yqlj') { // 设置活动的友情链接面板
if (tabs.getItem(nodeid)) {
tabs.setActiveTab(nodeid);
} else {
items = tabs.add({
title : nodeText,
frame : true,
layout : 'fit',
iconCls : 'link_edit',
id : nodeid,
closable : true,
activeTab : nodeText,
closeAction : 'hide',
items : yqlj_grid
});
tabs.setActiveTab(items);// 设置为活动面板
tabs.doLayout();   // 重新计算布局
}

} else if (nodeid == 'xgma') { // 设置活动的修改密码面板
pwd_win.show();
}
}); 

Answer 5

extjs-j2ee 讨论群 62751309

Answer 6

在你的tabpanel定义中增加如下事件
listeners:{remove:function(tp,c)
{
  c.hide();
  
}
}/**作这个处理，为的是关闭一个tab后，再次打开时它还能显示出来*/
});
应该就可以了

Answer 7

你可以试一下把
autoDestroy: true,
改成
autoDestroy: false,

Answer 8

这个我试过,行不通~~这问题有木有解决的啊,现在也遇到这问题,头疼ING

Answer 9

遇到相同问题,有解决办法吗?
第二次打开tabpanel 无法获取属性“parentNode”的值: 对象为 null 或未定义我跟了一下代码,问题出在
contentTabPanel.setActiveTab(newTab);
这个方法上,求解决办法啊......

Answer 10

唉,Extjs4.0我遇到同样的问题，而且更严重的是tabpanel每次加载起来非常慢。。IE差一点的直接死（或许里面的加载内容比较多吧，但是换成Extjs3.0就一点都不卡）

Answer 11

不要用items
这样 每次都定义一个id.
这个不好 用new 一个对象， 或者 <ifram html> 显示一个已存在的。

Answer 12

有没有人解决一下我 我也遇到了
这个问题很奇怪 你关闭再打开是会报错
再关闭再打开就不会有错
反复很多次都有错
而且报错的时候 add返回的是false
本来想捕获异常再加载一次的都不行
有木有大侠啊

Answer 13

 我用的ExtJS4.1,打开Tab没问题,再关闭,再打开整个Tab就全不见了;用FX查看,某对象is null; 

Answer 14

这个问题在firefox按照楼上的几位说的方法OK的,但是在IE8下面还是不行,第二次打开一片空白

Answer 15

有解决办法了吗，我的问题是tab页面只有包含chart控件，关闭的时候非常卡，有时候直接崩溃，有知道解决办法的吗？？？？

Answer 16

autoDestroy:false,
              listeners:{
               remove:function(tp,c)
               {
                 c.hide();               }
               }/**作这个处理，为的是关闭一个tab后，再次打开时它还能显示出来*/
第一句是将tab自动销毁设为false，然后覆盖原来销毁的方法改为隐藏,虽然不是非常好的解决办法，会占用内存，但是应付大部分工程还是没问题的

Answer 17

只设了tabpanel的autoDestroy:false
和tab的closeAction: 'hide'
就解决了。
ExtJS 4.1

Answer 18

不对，变了态了…………TAB标签本身是好了，但里面的按钮有问题：我本来是按“新增”按钮出来一个窗口，现在是我开关过x次TAB标签，再按那个“新增”按钮就会出来x个窗口迭在一起……

Answer 19

好吧，不是我灌水，是自己又想了个办法解决问题，贴出来供参考：
其实办法挺傻的，就是弹窗口之前判断一下，有没有已经存在的窗口，有就显示那个，没有就另外开一个
check_before_create = function(widget_name) {
    var all_widget = Ext.ComponentQuery.query(widget_name);
    if(all_widget.length > 0){
        all_widget[0].show();
    }else{
        Ext.widget(widget_name).show();
    }
};