1. #1
    Ext User
    Join Date
    Dec 2007
    Posts
    10
    Vote Rating
    0
    esdot is on a distinguished road

      0  

    Question Dynamically Change the Region of a Panel in a Border Layout

    Dynamically Change the Region of a Panel in a Border Layout


    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.

  2. #2
    Sencha User
    Join Date
    Mar 2007
    Posts
    7,854
    Vote Rating
    4
    tryanDLS is on a distinguished road

      0  

    Default


    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.

  3. #3
    Ext User
    Join Date
    Dec 2007
    Posts
    10
    Vote Rating
    0
    esdot is on a distinguished road

      0  

    Default


    Quote Originally Posted by tryanDLS View Post
    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.

  4. #4
    Ext User
    Join Date
    Dec 2007
    Posts
    10
    Vote Rating
    0
    esdot is on a distinguished road

      0  

    Default


    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!


  5. #5
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,508
    Vote Rating
    58
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Did you call doLayout after adding?

  6. #6
    Sencha User
    Join Date
    Jul 2010
    Posts
    51
    Vote Rating
    -1
    hdave is an unknown quantity at this point

      0  

    Default


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

  7. #7
    Touch Premium Member
    Join Date
    Jul 2011
    Location
    Helsinki, Finland
    Posts
    71
    Vote Rating
    0
    kortsi is on a distinguished road

      0  

    Default


    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).