Panel / Grid Auto resize on browser window resize

  1. #1

    Panel / Grid Auto resize on browser window resize


    I am upgrading a project from 1.4 to 2.5.1. There used to be a property I could set which would trigger panel / grid resizing when the browser window is resized called MonitorResize="True". That doesn't seem to be available in 2.5.1. I can see my Container Panel resizing, but the panels nested inside the container won't scale to the Container. I know the VewPort control works, but I cannot use the viewport in my case due to some issues with my master page.

    This is a sample of my code

        <ext:Container runat="server" Layout="BorderLayout" Height="700" StyleSpec="Width:100%" ResizeHandles="All" MonitorResize="true" AnchorHorizontal="100%">
                <ext:Panel ID="pnlSearchCriteria" runat="server" Collapsible="true" MinWidth="368"
                    Split="true" Width="368" Title="Search Criteria" Height="700" Layout="FormLayout"
                    TabTip="Search Criteria Panel (Shortcut: Ctrl + H)" Region="West">
                        <ext:Toolbar ID="bottom" runat="server">
                <ext:Container runat="server" ID="pgpanel" Layout="FitLayout" ResizeHandles="All" AnchorHorizontal="100%" Region="Center">
                        <ext:GridPanel ID="GridPanel1" StripeRows="true" AutoDataBind="false" Title="Search Results"
                            Header="true" TrackMouseOver="false" runat="server" TitleCollapse="false"
                            Collapsible="false" AutoFill="false"
                            MonitorResize="true" Stateful="true" EnableColumnHide="true">
                                <ext:PagingToolbar ID="PagingToolbar1" runat="server"
                                    DisplayInfo="true" DisplayMsg="Displaying Record(s) {0} - {1} of {2}" StoreID="Store1"
                                    EmptyMsg="No records to display" EnableViewState="false">
  2. #2

    Manual resize force onWindowResize method

    Hi again,
    I don't know if this is the best solution but it seems to work. I added this JavaScript call to my page and it now resizes the grid when the browser window is resized:

    <ext:XScript ID="XScript1" runat="server">
        <script type="text/javascript"> 
           Ext.EventManager.onWindowResize(function (w, h) {
    If there is a better "supported" method please let me know,

    Last edited by geoffrey.mcgill; May 07, 2014 at 1:59 AM.
  3. #3
    Hi @larotech,

    Welcome to the Ext.NET forums!

    Yes, your solution is good.

Similar Threads

  1. [CLOSED] Resize Content from Loader after Resize Window Container
    By Ujvari in forum 2.x Legacy Premium Help
    Replies: 1
    Last Post: Mar 27, 2014, 7:58 PM
  2. Gridpanel resize with browser window
    By DasPhansom in forum 1.x Help
    Replies: 3
    Last Post: Dec 22, 2008, 12:05 PM
  3. Auto Resize Panel in ViewPort on client-side Panel.AutoLoad
    By randy85253 in forum 1.x Legacy Premium Help
    Replies: 13
    Last Post: Dec 03, 2008, 3:27 PM
  4. [CLOSED] Auto Resize of North Panel in ViewPort on Panel.AutoLoad
    By randy85253 in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Nov 19, 2008, 12:13 AM
  5. [CLOSED] wanting to get panel to resize with browser
    By pkellner in forum 1.x Legacy Premium Help
    Replies: 10
    Last Post: Oct 15, 2008, 1:05 AM

Tags for this Thread

Posting Permissions