1. #1
    Ext User
    Join Date
    Sep 2009
    Posts
    41
    Vote Rating
    0
    olamalam is on a distinguished road

      0  

    Question ext.panel not fitting in viewport

    ext.panel not fitting in viewport


    Hi to all,

    I have a border-layout viewport with 3 regions (north,center,west).
    my center region does not fit from bottom and the top.
    is this a css problem or should I set some property of ext.Panel?

    thanks

    Code:
     
    var viewport = new Ext.Viewport({
                layout  : 'border',
                items   : [
                    new Ext.BoxComponent({ // raw
                        region  : 'north',
                        el      : 'north',
                        height  : 80
                    }),
     
                new Ext.Panel({
                   title           : 'Navigation',
                   id    : 'SearchByEntitiesPanel',
                   region          : 'west',
                   width           : 210,
                   minSize         : 100,
                   maxSize         : 400,
                   collapsible     : true,
                   margins         : '0 0 0 5',
                   split           : true,
                   contentEl       : 'west',
                   layout   : 'border'
               }),
                    new Ext.Panel({
                     id          : 'content-panel',
                        region      : 'center',
                        contentEl   : 'center',
                        title       : 'Main',
                        listeners   : {'bodyresize':onContentPanelResize},
                        autoScroll  : true
                    })
                 ]
            });
    and

    Code:
     
    <div id="north">
                <a href="javascript:openWindow()" style="float:right;">
                    <img src="${createLinkTo(dir: 'images', file: 'thomsonreuters_sml.gif')}"/>
                </a>
                <h1>Transactions Directory and Reporting System Administration Interface</h1>
                <div id="logininfo" style="margin-right:5px">
                    <br><br>Welcome <g:loggedInUserInfo field="userRealName">Guest User</g:loggedInUserInfo> -
                <g:link class="create" controller="tdrsUser" action="changePassword" target="content-area">Change Password</g:link>
                -
                    <a href="${createLinkTo(dir: 'logout')}">Logout</a>
                </div>
            </div>
            <div id="west">
            </div>
            <div id="center" style="height:100%">
                <table bgcolor=aqua width="100%" height="100%">
                    <tr>
                        <td>
                            <IFRAME id="content-area" name="content-area" frameborder="2" width="100%">
                            </IFRAME>
                        </td>
                    </tr>
                </table>
            </div>
    not fitting panel.jpg

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

      0  

    Default


    Use a ManagedIFramePanel

  3. #3
    Ext User
    Join Date
    Sep 2009
    Posts
    41
    Vote Rating
    0
    olamalam is on a distinguished road

      0  

    Default ext.panel not fitting in viewport

    ext.panel not fitting in viewport


    ok, instade of Ext.Panel I put this to center:

    Code:
     
        var content=new Ext.ux.ManagedIFrame ({
      autoCreate:{
       frameBorder: 0,
       cls:'x-panel-body',
       width: '100%',
       height: '100%',
                id          : 'content-panel',
                region      : 'center',
                contentEl   : 'center',
                title       : 'Main',
                listeners   : {'bodyresize':onContentPanelResize},
                autoScroll  : true
      }
     });
    but now I have a javascript error at ext-all.js: object doesnt support this property or method

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

      0  

    Default


    What's all this with contentEl?

    Didn't you read up about how to use a ManagedIFramePanel. I think Doug has documented it, so since he's provided this excellent code free, show him the courtesy of making an effort.

  5. #5
    Ext User
    Join Date
    Sep 2009
    Posts
    41
    Vote Rating
    0
    olamalam is on a distinguished road

      0  

    Default


    sorry, I've found the document, going to read it all...

  6. #6

Thread Participants: 1