PDA

View Full Version : extjs panel collapse and expand



ragendu
10 Jan 2013, 10:00 PM
Hi,

I have a form and 2 panels. These panels are in collapsed state when the form is loaded. My requirement is say panel 1 is expanded now, so panel 2 should be collapsed. If we expand panel 2 now panel 1 should be collapsed.
Could someone help me on this?

Thanks in advance..

droessner
11 Jan 2013, 5:30 AM
You can add an expand listener to each panel (http://docs.sencha.com/ext-js/4-1/#!/api/Ext.panel.Panel-event-expand) and then collapse (http://docs.sencha.com/ext-js/4-1/#!/api/Ext.panel.Panel-method-collapse) the other panel when the expand listener is fired.

ragendu
11 Jan 2013, 5:47 AM
droessner,
Thanks for the relply. I tried giving expand in the first panel
listeners:{
expand: function (p, eOpts ){
alert(" sec collapsed");
panel2.collapse();
}
But its giving error "panel2.collapse is not a function" in firebug..
Please suggest

droessner
11 Jan 2013, 5:57 AM
In firebug, what is panel2 when you expand the first panel? It should be the component reference of the second panel. This doesn't seem to be the case. How is the variable panel2 defined?

friend
11 Jan 2013, 5:59 AM
It sounds as if 'panel2' is out of scope. You may need to actually lookup panel2 via Ext.ComponentQuery.query() or the up()/down() methods supported by Panel.

ragendu
11 Jan 2013, 6:03 AM
Hey thanks..it worked :)