How do I Dynamically adding a new Collapsed Panel to an Accordion in Ext?
I have an Accordion in ExtJS and I want to add new Panels to it d开发者_开发问答ynamically. The Panels need to be collapsed when they appear. The code that I have now will create the Panels, but the HTML in each panel won't show.
var loadoutput = new Ext.Panel({
title: 'Log',
renderTo: 'logout',
layout: 'accordion',
defaults: {
bodyStyle: 'padding:10px',
collapsed: true
},
layoutConfig: {
fill: true,
animate: true
}
});
function logOutput(_title, _html) {
temp = new Ext.Panel();
temp.title = _title;
temp.html = _html;
temp.collapsed = true;
loadoutput.items.add(temp);
loadoutput.doLayout();
}
logOutput("Well, that was interesting", "Dude, what's up? <br/>Hey hey hey<br/>AAAAAH.");
logOutput("Hello", "Dude, what's up? <br/>Hey hey hey<br/>AAAAAH.");
logOutput("What?", "Dude, what's up? <br/>Hey hey hey<br/>AAAAAH.");
logOutput("Cat", "Dude, what's up? <br/>Hey hey hey<br/>AAAAAH.");
I think the problem is that you are using the "items" add method (it's a Ext.util.MixedCollection) instead of the Ext.Panel add method.
Try this:
loadoutput.add(temp);
So, this code works above. items.add or add both work. One issue is boxMinHeight. Need to set it manually I guess.
精彩评论