First panel in accordion multi layout is always expanded
REQUIRED INFORMATION
Ext version tested:- Ext 4.1.1
- Ext 4.1.1 rev a
Browser versions tested against:- Safari 6.0.1
- Chrome 22.0.1229.94
DOCTYPE tested against:Description:- When using an accordion layout with the multi config, the first panel is always expanded, even when it is explicitly set to collapsed:false.
Steps to reproduce the problem:- Create a panel with accordion layout.
- Add several sub-panels.
- Set all sub-panels to collapsed:true except for the last one which should be collapsed:false.
The result that was expected:- Last panel is expanded
- All other panels are collapsed
The result that occurs instead:- First and last panel are both expanded.
- All other panels are collapsed
Test Case:
PHP Code:
Ext.create('Ext.Panel', {
title: 'Example',
width: 100,
renderTo: Ext.getBody(),
layout: {
type: 'accordion',
align: 'stretch',
// switch to false to see expected behavior
multi: true
},
defaults: {
height: 100
},
items: [
{
xtype: 'panel',
title: 'panel 1',
html: 'panel 1',
collapsed: true},
{
xtype: 'panel',
title: 'panel 2',
html: 'panel 2',
collapsed: true},
{
xtype: 'panel',
title: 'panel 3',
html: 'panel 3',
collapsed: true},
{
xtype: 'panel',
title: 'panel 4',
html: 'panel 4',
collapsed: false},
]
});
HELPFUL INFORMATION
See this URL for live test case:
http://jsfiddle.net/GdQtk/
Debugging already done:Possible fix:- One workaround is to attach a listener to the first panel for the beforerender event. In the listener, set panel.collapsed = true to force the first panel to a collapsed state.
Additional CSS used:Operating System:- OS X 10.8.2
- Windows 7 Pro SP1
