View Full Version : [DUP] [4.0.5] Nested panel disappears on collapse

30 Jul 2011, 10:18 AM

Ext version tested:

Ext 4.0 rev 5

Browser versions tested against:

Google Chrome 12
FF5 (firebug 1.7.3 installed)


Nesting a collapsible panel in another one lets the panel header disappear on collapse.

Steps to reproduce the problem:

Use the supplied test case, collapse the inner panel
Add "width: 498" to the inner panel's config to see the difference

The result that was expected:

Collapsed panel header should be visible

The result that occurs instead:

Collapsed header stays in place, but disappears

Test Case:

Ext.onReady(function() {
Ext.create('widget.panel', {
width: 500, title: 'outer', renderTo: Ext.getBody(), items: [
{ collapsible: true, title: 'Inner 1', height: 200, html: 'Some content' },
{ title: 'Inner 2', height: 200, html: 'Some more content' }


The problem was not present in 4.0.2b
The problem is apparently caused by a width miscalculation.

Possible workaround (no fix):

Specify a width for the inner panel
Stick to 4.0.2a :-(

Additional CSS used:

only default ext-all.css

Operating System:

Windows 7 x64

31 Jul 2011, 9:07 PM
I remember Ed showing me this just last week in response to another forum thread.

If you need a series of collapsible Panels stacked up inside a Panel, use layout: 'anchor', and have each child Panel use anchor '100%'

This explicitly anchors the child Panels to use the maximum width, and accounts for the appearance of scrollbars.

2 Aug 2011, 12:16 AM
Makes sense as a workaround, thanks Nige. Should be fixed nonetheless ;)

15 Nov 2011, 12:45 PM
Just checked against our latest code and cannot see this issue anymore.