View Full Version : show hide tab in tabpanel problem (selector hidden)

15 Feb 2012, 2:20 PM
My app is a viewport with two panels - the left panel is a navtree menu, the center panel is a tab panel. When items in the navtree are clicked, a tab will open in the tab panel. I'm having trouble with the hiding and closing of tabs in the tabpanel.

My tabs are created with

closable : true,
closeAction: 'hide',

and I have a listener bound to the navtree that checks if a tab exists, and if it does show() it - if it doesn't exist then add it to the tabpanel.

new Ext.Viewport({
layout : 'border',
items : [{
region : 'center',
layout : 'border',
border : false,
items : [{
xtype : 'reports-navtree',
id : 'app-navtree',
listeners : {

'navclick' : function(tree, nodeId) {
var tabs = Ext.getCmp('app-tabpanel')
var navId = nodeId.split('.')[0];
if (navId == 'CompanyCustomerSummary') {
var tab = Ext.getCmp('tab-CompanyCustomerSummary');
if (tab) {
} else {
xtype : 'reports-companyCustomerSummary'
scope : this
}, {
region : 'center',
xtype : 'tabpanel',
id : 'app-tabpanel',
autoDestroy : false,
activeItem : 0,
items : [{
xtype : 'reports-dashboard',
id : 'tab-dashboard'

This works fine up to a point - when a tab is closed, it's hidden, when the tab's menu item is clicked again, the listener picks up that it exists, and then show()'s it again. The problem is that the tab is redisplayed - but its selector is hidden. Is there a way to redisplay the tab's selector when unhiding a tab? Thanks.

16 Feb 2012, 5:11 AM
What do you mean selector?

You will probably need to show the tab instance also.