Gridpanel doesn't resize properly

[gdog_5021]

I have a ext:ViewPort tag with the attribute Layout="fit". One of its children is a gridpanel as follows:

<ext:ViewPort ID="ApplicationViewPort" runat="server" Layout="fit">
        <Items>
            <ext:GridPanel 
                runat="server" 
                ID="ApplicationsGridPanel" 
                Title="Applications" 
                Frame="true" 
                StoreID="ApplicationsStore" 
                Height="400" 
                ClicksToEdit="1"
                AutoScroll="true">
                <ColumnModel ID="ColumnModel1" runat="server" >
                    <Columns>

The problem is this: if the browser window of ie8 does not cover the full screen initially, the gripanel sizes properly whithin the vieport. If you then
increase the browser window to full screen, the gripanel resizes correctly but if you then hit the restore system menu button to
restore the browser window to its original size, the gridpanel does not resize properly. It does not contain the proper scrollbars or
resize to fit the gridpanel to the original window even though it had properly resized the grid to the window when it was first rendered.

[Daniil]

Hi,

I have a ext:ViewPort tag with the attribute Layout="fit". One of its children is a gridpanel as follows:

FitLayout expects a single item (child).

[gdog_5021]

There is only one item in the viewport for this particular tab. The GridPanel works initially to resize itself to the Browser window size which I assume is controlled through the Viewport. If you then maximize the browser window to the full screen, the GridPanel resizes to fit the new browser window screensize. If we then press the browser window system menu to restore its window to its former sizem, the GridPanel must not get the event so it doesn't restore itself to fit the smaller screen. As can be seen from the attachments, the GridPanel does not restore itself to its initial state. The intermediate state worked correctly when the browser window was at its full screem size.

[Daniil]

Please provide a full test case to reproduce the problem.

[gdog_5021]

It seems that the problem occurs when the form tag is the outer tag. When I sent you the mark-up, I thought it was the Grid panel interacting with the view port as was shown above. The culprit was the form tag. When the form tag was removed , the code worked as designed. It resized properly when restored from full screen to its original size. Somehow the viewport doesn't work properly upon resize restoration if it contains an outer form tag. As far as I am concerned, this is a bug. There is no doubt about it. The grids work beautifully under all other conditions and the code layout is similar. I have proved that this is the problem because all the screens that have the form tag show the bug characteristics. This is an MVC 2 application.

<form id="form1" runat="server">
    <ext:ResourceManager ID="ApplicationResourceManager" runat="server" ScriptMode="Debug" />
    <asp:ObjectDataSource ID="DataSource" 
                          TypeName="Library.Model.DAL.ApplicationsRepository" 
                          SelectMethod="GetAllApplications" 
                          UpdateMethod="UpdateEntity" 
                          DeleteMethod="DeleteEntity" 
                          InsertMethod="InsertEntity" 
                          runat="server" 
                          DataObjectTypeName="Library.Model.aspnet_Applications"/>    
    <ext:Store ID="ApplicationsStore"  DataSourceID="DataSource" runat="server">
        <Reader>
            <ext:JsonReader IDProperty="ApplicationId">
                <Fields>
                    <ext:RecordField Name="ApplicationId"  Type="String" />
                    <ext:RecordField Name="ApplicationName" Type="String" />
                    <ext:RecordField Name="Description" Type="String" />
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>    
    <ext:ViewPort ID="ApplicationViewPort" runat="server" Layout="fit">
        <Items>
            <ext:GridPanel 
                runat="server" 
                ID="ApplicationsGridPanel" 
                Title="Applications" 
                Frame="true" 
                StoreID="ApplicationsStore" 
                Height="400" 
                ClicksToEdit="1"
                AutoScroll="true" >
                <ColumnModel ID="ColumnModel1" runat="server" >
                    <Columns>

[geoffrey.mcgill]

It seems that the problem occurs when the form tag is the outer tag. When I sent you the mark-up, I thought it was the Grid panel interacting with the view port as was shown above. The culprit was the form tag. When the form tag was removed , the code worked as designed. It resized properly when restored from full screen to its original size. Somehow the viewport doesn't work properly upon resize restoration if it contains an outer form tag. As far as I am concerned, this is a bug. There is no doubt about it. The grids work beautifully under all other conditions and the code layout is similar. I have proved that this is the problem because all the screens that have the form tag show the bug characteristics. This is an MVC 2 application.

<form id="form1" runat="server">
    <ext:ResourceManager ID="ApplicationResourceManager" runat="server" ScriptMode="Debug" />
    <asp:ObjectDataSource ID="DataSource" 
                          TypeName="Library.Model.DAL.ApplicationsRepository" 
                          SelectMethod="GetAllApplications" 
                          UpdateMethod="UpdateEntity" 
                          DeleteMethod="DeleteEntity" 
                          InsertMethod="InsertEntity" 
                          runat="server" 
                          DataObjectTypeName="Library.Model.aspnet_Applications"/>    
    <ext:Store ID="ApplicationsStore"  DataSourceID="DataSource" runat="server">
        <Reader>
            <ext:JsonReader IDProperty="ApplicationId">
                <Fields>
                    <ext:RecordField Name="ApplicationId"  Type="String" />
                    <ext:RecordField Name="ApplicationName" Type="String" />
                    <ext:RecordField Name="Description" Type="String" />
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>    
    <ext:ViewPort ID="ApplicationViewPort" runat="server" Layout="fit">
        <Items>
            <ext:GridPanel 
                runat="server" 
                ID="ApplicationsGridPanel" 
                Title="Applications" 
                Frame="true" 
                StoreID="ApplicationsStore" 
                Height="400" 
                ClicksToEdit="1"
                AutoScroll="true" >
                <ColumnModel ID="ColumnModel1" runat="server" >
                    <Columns>

This code appears correct. Can you post a complete (but simplified) .aspx sample demonstrating exactly how we can reproduce the issue?

[gdog_5021]

I have many screens and I have applied the above fix by removing the form tag. I do have one screen where this procedure didn't work properly. I looked at the mark-up to see why the removal of the form didn't work. Upon reflection, I think the problem is not interaction between the form tag and the viewport but the ResourceManager. If the ResourceManager is not a child of the form tag, the resizing works properly. If the form tag is the parent of the ResourceManager, it doesn't resize properly.

<ext:ResourceManager ID="BusinessModelResourceManager" runat="server"  /> 
   <form id="BusinessModelForm" runat="server">
        <ext:Viewport ID="BusinessModelViewport" runat="server">
            <Items>

This sequence resizes properly.

<form id="BusinessModelForm" runat="server">
        <ext:ResourceManager ID="BusinessModelResourceManager" runat="server"  /> 
        <ext:Viewport ID="BusinessModelViewport" runat="server">
            <Items>

This sequence doesn't resize properly.

[geoffrey.mcgill]

I have many screens and I have applied the above fix by removing the form tag. I do have one screen where this procedure didn't work properly. I looked at the mark-up to see why the removal of the form didn't work. Upon reflection, I think the problem is not interaction between the form tag and the viewport but the ResourceManager. If the ResourceManager is not a child of the form tag, the resizing works properly. If the form tag is the parent of the ResourceManager, it doesn't resize properly.

<ext:ResourceManager ID="BusinessModelResourceManager" runat="server"  /> 
   <form id="BusinessModelForm" runat="server">
        <ext:Viewport ID="BusinessModelViewport" runat="server">
            <Items>

This sequence resizes properly.

<form id="BusinessModelForm" runat="server">
        <ext:ResourceManager ID="BusinessModelResourceManager" runat="server"  /> 
        <ext:Viewport ID="BusinessModelViewport" runat="server">
            <Items>

This sequence doesn't resize properly.

I think there has to be more to it than that. The ResourceManager does not actually render anything inline at the tag location.

P.s. Please ensure you wrap your code samples in [CODE] tags.

[gdog_5021]

The screen is complicated but when I removed the form tag from the above markup where the ResourceManager was a sibling tag of the form tag, it didn't resize or render properly. When I put the form tag back as a sibling of the ResourceManager, it worked. All the other screens that had the ResourceManager tag as a child of the form tag didn't work. I know you guys created it to remove your connection to the script manager but the page load sequence must not be totally correct for this particular tag sequence. Currently, I am not doing too much with Microsoft ajax so fixing these dependencies doesn't matter but I am planning to interface your framework with silverlight so I will need the form tag in order to utilize Microsoft's ajax framework or JQuery. Basically, I am thinking of embedding some asp.net or silverlight controls into your framework layout. The form tag's interaction with the ResourceManager will become an issue.

[plykkegaard]

Any particular reason to why you want the ressourcemanager added as a child to the form?
In my opinion the ressourcemanager is for the page and should be at the same level as the form

I can add that I have also seen all sorts of strange behaviour when ressourcemanager is nested within the form

rgds /Peter