Accordion layout confusion - extjs4.1

Question

I am using a Panel which has set of accordions Say first child , second child , third child.
i found when the panel has been instantiated the first child
will auto expand. but when i remove the first child, the Accordion layout panel cannot auto expand child.
sorry for my poor English and unclear expression,can someone help and figure it out
var firstChild ={
id:'first',
title: 'first child',
html: 'first child'
};
var acc= Ext.create('Ext.panel.Panel', {
title: 'Accordion layout',
width: 300,
height: 300,
layout:'accordion',
defaults: {
bodyStyle: 'padding:15px'
},
layoutConfig: {
titleCollapse: false,
animate: false,
activeOnTop: true,
collapseFirst:true
},
items: [
firstChild,
{
title: 'second child',
html: 'second child'
},{
title: 'third child',
html: 'third child'
}],
renderTo: 'demo'
});
acc.remove(Ext.getCmp("first"));
after remove the first child ,cannot auto expand child
new users aren't allowed to post images,here is the address
http://i.stack.imgur.com/im848.jpg
http://i.stack.imgur.com/E1ze7.jpg

Answer 1

You can just tell it to expand:
Ext.onReady(function() {
var acc = Ext.create('Ext.panel.Panel', {
title: 'Accordion layout',
width: 300,
height: 300,
layout: 'accordion',
defaults: {
bodyStyle: 'padding:15px'
},
layoutConfig: {
titleCollapse: false,
animate: false,
activeOnTop: true,
collapseFirst: true
},
items: [{
id: 'first',
title: 'first child',
html: 'first child'
}, {
title: 'second child',
html: 'second child'
}, {
title: 'third child',
html: 'third child'
}],
renderTo: document.body
});
acc.remove('first');
acc.items.first().expand();
});

Answer 2

I think this is a reported bug :
http://www.sencha.com/forum/showthread.php?247396-4.1.3-Accordion-Layout-not-working-when-dynamically-adding-items