PDA

View Full Version : Ext.tab.Panel - any kind of hiding doesn't work



korery
27 Jul 2013, 11:21 PM
Ext version tested:

Ext 4.2.0

Browser versions tested against:

FF22.0

Description:

Ext.tab.Panel - any kind of hiding doesn't work

Steps to reproduce the problem:

Create an Ext.TabPanel where the tools is configured with a collapse and expand button

The result that was expected:

show 2 tabs (Foo and Bar) after click on expand button
show 1 tab (Foo) after click on collapse button

The result that occurs instead:

nothing occurs

Test Case:
Ext.create('Ext.tab.Panel', {
width: 400,
height: 400,
renderTo: document.body,
tools: [
{
type: 'expand',
handler: function (q, qq, qqq, tool) {
var tab = tool.up('tabpanel').down('bar');
tab.setVisible(true); // I tried to use: .show(), .hidden = true
}
}, {
type: 'collapse',
handler: function (q, qq, qqq, tool) {
var tab = tool.up('tabpanel').down('bar');
tab.setVisible(false); // I tried to use: .hide(), .hidden = false
}
}
],
items: [{
itemId: 'foo',
title: 'Foo',
html: 'TEXT Foo'
}, {
itemId: 'bar',
title: 'Bar',
html: 'Text Bar',
tabConfig: {
title: 'Custom Title',
tooltip: 'A button tooltip'
}
}]
});

evant
28 Jul 2013, 12:55 AM
This isn't a bug, the tab item itself has a reference to the tab button. Also, your query isn't correct for grabbing the tab item.



var tab = tool.up('tabpanel').down('#bar').tab;
tab.hide();