Results 1 to 9 of 9

Thread: [Help!] Multiple Windows within layout

  1. #1
    Sencha User
    Join Date
    Jul 2008
    Posts
    25
    Vote Rating
    0
      0  

    Default [Help!] Multiple Windows within layout

    I have a page with borderlayout as follows:

    Ext.onReady(function()
    {
    Ext.QuickTips.init();

    var win1 = new Ext.Window({...............});

    var mainPanel = new Ext.Panel
    ({
    id: 'mainpanel',
    name: 'mainpanel',
    title: 'Main Frame',
    region: 'center',
    margins: '0 0 0 0',
    autoScroll: true,
    scope: this
    });

    var itemPanel= new Ext.Panel ({
    id: 'itemtree',
    name: 'itemtree',
    region: 'north',
    split: true,
    height: 300,
    autoScroll: true,

    });

    var taskPanel = new Ext.Panel
    ({
    id: 'taskpanel',
    name: 'taskpanel',
    title: 'Task',
    region: 'center'
    });

    new Ext.Viewport
    ({
    layout: 'border',
    items: [{
    layout: 'border',
    id: 'defaultlayout',
    name: 'defaultlayout',
    title: 'Items',
    region: 'west',
    collapsible:true,
    split: true,
    width: '20%',
    margins: '0 0 0 0',
    items: [treePanel, taskPanel]
    },
    mainPanel
    ],
    renderTo: Ext.getBody()
    });
    });
    I want the mainPanel to be able to contain multiple Ext.Window(s), and I want these windows to be bounded inside the mainPanel..! (unlike now they just go on top of the whole layout....)

    I tried rendering the window to the mainPanel but it doesn't work......

    Please Help!

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,626
    Vote Rating
    56
      0  

    Default

    Render them to mainPanel's Element.
    Longtime Sencha geek. Outspoken advocate of pure Javascript Views. Posts my own opinions.

  3. #3
    Ext User
    Join Date
    Jul 2007
    Location
    Florida
    Posts
    9,996
    Vote Rating
    8
      0  

    Default

    1. try using code tags, not quote tags
    2. try indenting your code
    3. try the layout browser example to see what layout you want

  4. #4
    Sencha User
    Join Date
    Jul 2008
    Posts
    25
    Vote Rating
    0
      0  

    Default

    Quote Originally Posted by Animal View Post
    Render them to mainPanel's Element.
    Render to mainpanel's Element?? What that mean....?? something like this...??

    win1.render(Ext.getCmp('mainpanel').getEl())
    ??

  5. #5
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,626
    Vote Rating
    56
      0  

    Default

    Tried it?
    Longtime Sencha geek. Outspoken advocate of pure Javascript Views. Posts my own opinions.

  6. #6
    Sencha User
    Join Date
    Jul 2008
    Posts
    25
    Vote Rating
    0
      0  

    Default

    I have done it by adding the window as an item within the mainPanel......

    However.... when I drag and drop the window.... the window moves itself to the right (east) on the X axis by approximately the width of the west border layout.....

    I played around with the dd object within the window object.....

    Please help.... I am trying to remove this effect....

  7. #7
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,626
    Vote Rating
    56
      0  

    Default

    A Window cannnot be a child item of a Container.

    Just render it to the mainPanel's Element.
    Longtime Sencha geek. Outspoken advocate of pure Javascript Views. Posts my own opinions.

  8. #8
    Sencha User
    Join Date
    Jul 2008
    Posts
    25
    Vote Rating
    0
      0  

    Default

    Why not?? I got the window to work find with in the Ext.Panel Object.... and it is bounded inside the mainPanel......

    I tried rendering it to the mainPanel's Element..... By it isn't any better...... The Ext.Window object still sits on top of the whole layout....

  9. #9
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Redwood City
    Posts
    30,626
    Vote Rating
    56
      0  

    Default

    Well, I can run up the examples/layout/complex.html example here, and type this into the Firebug console:

    Code:
    new Ext.Window({title: 'Foo', width:100, height:100, renderTo: 'ext-comp-1013', constrain: true}).show()
    (ext-comp-1013 is ID of the "center" Panel which is a TabPanel in this case)

    And the Window can be dragged around in the center region, and won't move out of it.
    Longtime Sencha geek. Outspoken advocate of pure Javascript Views. Posts my own opinions.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •