PDA

View Full Version : accordion with independent panels



Wu-mc
1 Jul 2008, 2:56 AM
Hello,

i see the example by saki which introduces independent panels for the accordion for Ext 1.x. In this thread (http://extjs.com/forum/showthread.php?t=14535) saki said something about port it to Ext 2.0 but the thread is over an year old. Has anyone done something like this in Ext 2.x by extending the accordion layout? I tried to overwrite the beforeExpand handler, but there seems to be a problem with the calculation of the height of each expanded item so that when the first panel is expanded, it takes the whole space and the others are invisible. Here is my current version of this:


Ext.ns('Ext.ux');

Ext.ux.IndependentAccordion = Ext.extend(Ext.layout.Accordion,
{
independent: false,

renderItem : function(c)
{
if(this.independent)
c.independent = true;

Ext.ux.IndependentAccordion.superclass.renderItem.apply(this, arguments);
},

beforeExpand : function(p, anim){
var ai = this.activeItem;
if(ai){
if(this.sequence){
delete this.activeItem;
if (!ai.collapsed && !this.independent){
ai.collapse({callback:function(){
p.expand(anim || true);
}, scope: this});
return false;
}
}else if (!this.independent){
ai.collapse(this.animate);
}
}
this.activeItem = p;
if(this.activeOnTop){
p.el.dom.parentNode.insertBefore(p.el.dom, p.el.dom.parentNode.firstChild);
}
this.layout();
}
});

Ext.Container.LAYOUTS['independentaccordion'] = Ext.ux.IndependentAccordion;