Dynamically Change the Region of a Panel in a Border Layout

[esdot]

Hello everyone,

Before I ask for help, let me just say thanks to all the ExtJS developers. Ext is hands down the most comprehensive javascript framework and it makes my life so much easier! So thank you, you guys rock!

And now my question: I have a very complex layout using several nested panels (border layouts). After the page is loaded and interface created, I would like to change the region of a certain panel. For example, change a grid that's in the west region to the east region. Is there an easy way to achieve this? I was hoping to see a setRegion method in the Panel class ... looks like no such function has been created. Any thoughts on how to approach this?

Thanks in advance!
s.

[tryanDLS]

There's nothing built in to do this. Doing this would mean physically moving the content from one spot in the DOM to another. Given the size of the DOM for a grid this might be slow, especially with an already complex layout. You could experiment with this, but it might be easier to just re-render the grid in the other panel, using the first grid's store.

[esdot]

There's nothing built in to do this. Doing this would mean physically moving the content from one spot in the DOM to another. Given the size of the DOM for a grid this might be slow, especially with an already complex layout. You could experiment with this, but it might be easier to just re-render the grid in the other panel, using the first grid's store.

Thanks for the quick comment Tim. I was afraid of that. As a workaround, I put a "container" panel in each region of the layout (center, north, east, south, west) - each of these panels i gave layout of "fit". I then tried to remove a panel from the east container and add it to the west container. The remove part worked, but adding it to the west didn't - I'm not sure why. I saw a change in the container layouts background when I called doLayout but the panel didn't show up How do ensure it's "re-rendering" correctly? Do I need to recreate all the nested panel objects? That would be very expensive since there are several nested grids I'm really bangin my head against the wall, thanks for any help.

[esdot]

To be more specific I am using the method employed in #4 of the following link

http://extjs.com/learn/LayoutFAQ

Here, the author defines a way of swapping out one panel for another. Is it possible to remove a panel from one section and place the panel that was removed into another (i.e., remove a panel from the east, place it in the west)? what if the the panel i wish to move is a grid or a nested border layout panel? Thanks so much for your help!

[Animal]

Did you call doLayout after adding?

[hdave]

Sorry to resurrect and old thread, but where did this end up? I have the same requirement.

[kortsi]

I would also like to hear if anybody got this working.

I'd like to move a certain panel between 'east' and 'south', depending on the width of the user interface (initially, and on windowresize event).