PDA

View Full Version : [OPEN] Accordion with fill:false can cause panels to disappear



keithrz
13 Dec 2012, 2:39 PM
Taking this example:
http://try.sencha.com/extjs/4.0.7/examples/layout/column/viewer.html

you can set fill: false by changing layout from a string to a config (side note - setting fill: false in the layoutConfig object does not seem to work.)

so if you change this code in app.js:


cmargins: '35 5 5 5',
layout: 'accordion',
layoutConfig: {
animate: true
},
items: [{


to this:


cmargins: '35 5 5 5',
layout: {
type: 'accordion',
fill: false,
animate: true
},
items: [{


you get the desired, documented behavior for fill: false. However, there are 2 problems:
1. both columns are expanded, even though multi should default to false. Changing multi to false explicitly does not work. I tried setting it in the layout object, and I also tried setting it in a separate layoutConfig object.
2. try collapsing the first panel, then expanding it again. It will disappear!

Test case:


var shortBogusMarkup = '<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed metus nibh, ' +
'sodales a, porta at, vulputate eget, dui. Pellentesque ut nisl. Maecenas tortor turpis, interdum non, sodales ' +
'non, iaculis ac, lacus. Vestibulum auctor, tortor quis iaculis malesuada, libero lectus bibendum purus, sit amet ' +
'tincidunt quam turpis vel lacus. In pellentesque nisl non sem. Suspendisse nunc sem, pretium eget, cursus a, fringilla.</p>';

var viewport = Ext.create('Ext.container.Viewport', {
layout : 'border',
items : [
{
region : 'west',
id : 'west-panel',
title : 'West',
split : true,
width : 200,
minSize : 175,
maxSize : 400,
collapsible : true,
margins : '35 0 5 5',
cmargins : '35 5 5 5',
layout : {
type : 'accordion',
fill : false,
animate : true
},
items : [
{
html : shortBogusMarkup,
title : 'Navigation',
autoScroll : true,
border : false,
iconCls : 'nav'
},
{
title : 'Settings',
html : shortBogusMarkup,
border : false,
autoScroll : true,
iconCls : 'settings'
}
]
},
{
region : 'center',
margins : '35 5 5 0',
layout : 'column',
autoScroll : true,
defaults : {
layout : 'anchor',
defaults : {
anchor : '100%'
}
},
items : [
{
columnWidth : 1 / 3,
baseCls : 'x-plain',
bodyStyle : 'padding:5px 0 5px 5px',
items : [
{
title : 'A Panel',
html : shortBogusMarkup
}
]
},
{
columnWidth : 1 / 3,
baseCls : 'x-plain',
bodyStyle : 'padding:5px 0 5px 5px',
items : [
{
title : 'A Panel',
html : shortBogusMarkup
}
]
},
{
columnWidth : 1 / 3,
baseCls : 'x-plain',
bodyStyle : 'padding:5px',
items : [
{
title : 'A Panel',
html : shortBogusMarkup
},
{
title : 'Another Panel',
html : shortBogusMarkup
}
]
}
]
}
]
});

mitchellsimoens
14 Dec 2012, 5:49 AM
Testing in 4.1.3 I do not see the behavior as was in 4.0.7.

However in 4.2.0 beta looks like the first accordion panel won't collapse so will be reporting that bug.

mitchellsimoens
14 Dec 2012, 5:50 AM
Thanks for the report! I have opened a bug in our bug tracker.