[CLOSED] Displaying Error After Resizing the window

[imaa]

i used a function to resize the window regarding the content at beforrender event , the function is :

var HandelWindowSize=function (form) {
    if (window.parentAutoLoadControl) {
        var size = form.getSize()
        var height= (size.height > 500 ? 500 : (size.height + 50))
        size.width = size.width + 50;
        size.height =height;
        window.parentAutoLoadControl.setSize(size);
        window.parentAutoLoadControl.center()
    }
}

<AfterRender Handler="HandelWindowSize(#{vpMailReader});" Delay="250" />

after resizing in some pages the gird shows as the attachment , any help please ,
Best and Regards
Ab Abulubbad

[Daniil]

Hi,

Please provide a Window markup/code. I think there is a layout problem.

[imaa]

this is the markup/code for the whole page ,the grid name is 'gpMails'

        <ext:Store ID="stMails" IDMode="Static" runat="server" OnRefreshData="sMaileRader_OnRefreshData">
            <Reader>
                <ext:JsonReader IDProperty="MailTo_ID">
                    <Fields>
                        <ext:RecordField Name="Mail_ID">
                        </ext:RecordField>
                        <ext:RecordField Name="Sender">
                        </ext:RecordField>
                        <ext:RecordField Name="Reciver">
                        </ext:RecordField>
                        <ext:RecordField Name="Mail_Title">
                        </ext:RecordField>
                        <ext:RecordField Name="MailContentSize">
                        </ext:RecordField>
                        <ext:RecordField Name="Mail_Imported">
                        </ext:RecordField>
                        <ext:RecordField Name="Mail_ImportNo">
                        </ext:RecordField>
                        <ext:RecordField Name="MailImporter_ID">
                        </ext:RecordField>
                        <ext:RecordField Name="Mail_Exported">
                        </ext:RecordField>
                        <ext:RecordField Name="Mail_ExportNo">
                        </ext:RecordField>
                        <ext:RecordField Name="MailExporter_ID">
                        </ext:RecordField>
                        <ext:RecordField Name="MailTo_ID">
                        </ext:RecordField>
                        <ext:RecordField Name="ImportedByHierarchy_ID">
                        </ext:RecordField>
                        <ext:RecordField Name="Mail_ReadDate">
                        </ext:RecordField>
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
        <ext:Store ID="stProcessFolders" runat="server">
            <Reader>
                <ext:JsonReader IDProperty="Process_ID">
                    <Fields>
                        <ext:RecordField Name="Process_Name">
                        </ext:RecordField>
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
       
        <ext:Viewport ID="vpMailReader" IDMode="Static" runat="server" Layout="border">
        <Content>
        <ext:Hidden ID="hf_mailType" IDMode="Static" runat="server" ></ext:Hidden>
        </Content>
            <Items>
                <ext:Panel ID="pnMailInformation" runat="server" Title="البريد الشخصي" Region="East"
                    Layout="accordion" Width="200" Height="600" MinWidth="200" MaxWidth="200" Split="true"
                    Collapsible="true" IDMode="Static">
                    <Items>
                        <ext:Panel ID="pnImportMail" runat="server" Title=" البريد الوارد" Border="false"
                            Padding="6" Height="200" MaxHeight="100" CollapseFirst="true" Icon="ArrowIn"
                            IDMode="Static">
                            <Content>
                                <table style='direction: rtl; position: absolute;'>
                                    <tr align="right" style="padding-left: 100px;">
                                        <td align="right" dir="rtl" style="padding-left: 59px;">
                                            الرسائل الواردة
                                        </td>
                                        <td>
                                            <ext:LinkButton runat="server" IDMode="Static" ID="lnbtnAllInMails" AutoWidth="true"
                                                Text="(5)">
                                                <Listeners>
                                                    <Click Fn="getAllInMails" />
                                                </Listeners>
                                            </ext:LinkButton>
                                        </td>
                                    </tr>
                                </table>
                            </Content>
                        </ext:Panel>
                       
                        <ext:Panel ID="pnExportMail" runat="server" Title="البريد الصادر" Border="false"
                            Padding="6" MaxHeight="100" Icon="ArrowOut" IDMode="Static">
                            <Content>
                                <table style='direction: rtl; position: absolute;'>
                                    <tr align="right" style="padding-left: 100px;">
                                        <td align="right" dir="rtl" style="padding-left: 62px;">
                                            الرسائل الصادرة
                                        </td>
                                        <td>
                                            <ext:LinkButton runat="server" ID="lnbtnAllOutMails" IDMode="Static" AutoWidth="true"
                                                Text="(5)">
                                                <Listeners>
                                                    <Click Fn="getAllInMails" />
                                                </Listeners>
                                            </ext:LinkButton>
                                        </td>
                                    </tr>
                                </table>
                            </Content>
                        </ext:Panel>
                        <ext:Panel ID="pnSavedMail" runat="server" Title=" المسودات" Border="false" Padding="6"
                            MaxHeight="100" Icon="DatabaseSave" IDMode="Static">
                            <Content>
                                <table style='direction: rtl; position: absolute;'>
                                    <tr align="right" style="padding-left: 100px;">
                                        <td align="right" dir="rtl" style="padding-left: 62px;">
                                           المسودات
                                        </td>
                                        <td>
                                            <ext:LinkButton runat="server" ID="lnbtnAllSavedMails" IDMode="Static" AutoWidth="true"
                                                Text="(5)">
                                                <Listeners>
                                                    <Click Fn="getAllInMails" />
                                                </Listeners>
                                            </ext:LinkButton>
                                        </td>
                                    </tr>
                                </table>
                            </Content>
                        </ext:Panel>
                        <ext:Panel ID="pnMyFolders" runat="server" Title="مجلداتي" Border="false" Padding="6"
                            MaxHeight="200" Icon="FolderExplore" IDMode="Static" AutoScroll="true">
                            <Tools>
                                <ext:Tool Type="Refresh" Qtip="MyFolders" Fn="updateEmployeeProceeFolders" />
                            </Tools>
                            <Items>
                                <ext:TreePanel ID="tpMyFolders" IDMode="Static" runat="server" Icon="Anchor" Header="false"
                                    AutoScroll="true" Width="200" Collapsed="False" CollapseFirst="True" RootVisible="false"
                                    HideParent="False" BodyStyle="padding-left:10px">
                                    <Listeners>
                                        <Click Fn="selectNode" />
                                    </Listeners>
                                </ext:TreePanel>
                            </Items>
                        </ext:Panel>
                        <ext:Panel ID="pnlCCTSOnly" AutoScroll="true" runat="server" Title="خاص بموظفي الأتصالات"
                            Border="false" Padding="6" MaxHeight="200" Icon="Connect" IDMode="Static">
                            <Tools>
                                <ext:Tool Type="Refresh" Qtip="CTSEmployee" Fn="updateEmployeeProceeFolders" />
                            </Tools>
                            <Items>
                                <ext:TreePanel ID="tpCtsEmployeeFolders" IDMode="Static" runat="server" Icon="Anchor"
                                    Header="false" AutoScroll="true" Width="250" RootVisible="false" Collapsed="False"
                                    CollapseFirst="True" HideParent="False" BodyStyle="padding-left:10px">
                                    <Listeners>
                                        <Click Fn="selectNode" />
                                    </Listeners>
                                </ext:TreePanel>
                            </Items>
                        </ext:Panel>
                    </Items>
                </ext:Panel>
                <ext:Panel ID="pnMails" IDMode="Static" runat="server" Region="Center">
                    <Items>
                        <ext:Panel ID="pnShowMails" runat="server" Title="البريدالأبكتروني" Collapsible="true"
                            Header="false" Height="600" Border="true" Padding="6" AutoScroll="true">
                            <Items>
                                <ext:Toolbar ID="TbMails" IDMode="Static" runat="server">
                                    <Items>
                                        <ext:Button ID="btnMovetomyfolders" runat="server" Icon="BasketAdd" Text="نقل البريد الى">
                                            <Menu>
                                                <ext:Menu ID="menMovetomyfolders" runat="server">
                                                    <Items>
                                                        <ext:MenuItem ID="miMovetomyfolders" AutoRender="true" runat="server" Icon="Add"
                                                            Text="مجلداتي " Hidden="true">
                                                            <Listeners>
                                                                <Click Fn="MoveMailsToFolders" />
                                                            </Listeners>
                                                        </ext:MenuItem>
                                                    </Items>
                                                </ext:Menu>
                                            </Menu>
                                        </ext:Button>
                                    </Items>
                                </ext:Toolbar>
                                <ext:Label runat="server" ID="lblshowtext" Text="قائمة الرسائل الخاصة بك" />
                                <ext:GridPanel ID="gpMails" IDMode="Static" StoreID="stMails" Collapsible="true"
                                    Collapsed="false" runat="server" AutoHeight="true" Title="البريد الوارد" StripeRows="true"
                                    TrackMouseOver="true" ForceValidation="False" AutoWidth="true" AutoScroll="true"
                                    AutoShow="true">
                                    <ColumnModel ID="ColumnModel1" runat="server">
                                        <Columns>
                                            <ext:NumberColumn ColumnID="Mail_ID" DataIndex="Mail_ID" Format="00" Hidden="true" />
                                            <ext:Column ColumnID="clmSender" DataIndex="Sender" Width="175" Header="المرسل">
                                            </ext:Column>
                                            <ext:Column ColumnID="clmReciver" DataIndex="Reciver" Width="175" Header="المستقبل">
                                            </ext:Column>
                                            <ext:Column ColumnID="clmAddressExport" DataIndex="Mail_Title" Header="العنوان">
                                            </ext:Column>
                                            <ext:Column ColumnID="clmContentSize" DataIndex="MailContentSize" Header="حجم المحتوى">
                                            </ext:Column>
                                            <ext:Column ColumnID="clmSizeExport" DataIndex="Mail_ImportNo" Header="رقم وارد">
                                            </ext:Column>
                                            <ext:Column ColumnID="clmSizeExport" DataIndex="Mail_ExportNo" Header="رقم صادر">
                                            </ext:Column>
                                            
                                        </Columns> 
                                    </ColumnModel>
                                    <View>
                                    <ext:GridView ID="GridView1" runat="server">
                    <GetRowClass Fn="getRowClass" />                       
                </ext:GridView>
                                    </View>
                                    <SelectionModel>
                                        <ext:CheckboxSelectionModel ID="cbImportImportselection" runat="server" />
                                    </SelectionModel>
                                    <LoadMask ShowMask="true" Msg="جاري التحميل" />
                                    <Plugins>
                                        <ext:GridFilters runat="server" ID="GFiltersImport" Local="true" Enabled="true" ShowMenu="true">
                                            <Filters>
                                                <ext:StringFilter DataIndex="Sender">
                                                </ext:StringFilter>
                                                <ext:StringFilter DataIndex="Reciver">
                                                </ext:StringFilter>
                                                <ext:StringFilter DataIndex="Mail_Title">
                                                </ext:StringFilter>
                                                <ext:StringFilter DataIndex="Mail_ImportNo">
                                                </ext:StringFilter>
                                                <ext:StringFilter DataIndex="Mail_ExportNo">
                                                </ext:StringFilter>
                                            </Filters>
                                        </ext:GridFilters>
                                    </Plugins>
                                    <BottomBar>
                                        <ext:PagingToolbar Cls="Pager" PageSize="10" StoreID="stMails" NextText="التالي"
                                            PrevText="السابق" FirstText="الصفحة الاولى" LastText="الصفحة الاخيرة" runat="server"
                                            ID="ptpMain">
                                        </ext:PagingToolbar>
                                    </BottomBar>
                                    <Listeners>
                                        <RowDblClick Fn="ShowRowDetails" /> 
                                    </Listeners>
                                    
                                </ext:GridPanel>
                                <ext:GridPanel ID="gpProcessFolders" Hidden="true" IDMode="Static" StoreID="stProcessFolders"
                                    Collapsible="true" Collapsed="true" runat="server" AutoHeight="true" Title="العمليات"
                                    StripeRows="true" TrackMouseOver="true" ForceValidation="False" AutoWidth="true"
                                    AutoExpandColumn="Process_Name" AutoScroll="true" AutoShow="true">
                                    <ColumnModel ID="ColumnModel2" runat="server">
                                        <Columns>
                                            <ext:Column ColumnID="Process_Name" DataIndex="Process_Name" Header="أسماء العمليات"
                                                Width="60">
                                            </ext:Column>
                                        </Columns>
                                    </ColumnModel>
                                    <SelectionModel>
                                        <ext:CheckboxSelectionModel ID="CheckboxSelectionModel1" runat="server" />
                                    </SelectionModel>
                                    <LoadMask ShowMask="true" Msg="جاري التحميل" />
                                    <Plugins>
                                        <ext:GridFilters runat="server" ID="GridFilters1" Local="true" Enabled="true" ShowMenu="true">
                                            <Filters>
                                                <ext:StringFilter DataIndex="Group_Name">
                                                </ext:StringFilter>
                                            </Filters>
                                        </ext:GridFilters>
                                    </Plugins>
                                    <BottomBar>
                                        <ext:PagingToolbar Cls="Pager" PageSize="10" StoreID="stProcessFolders" NextText="التالي"
                                            PrevText="السابق" FirstText="الصفحة الاولى" LastText="الصفحة الاخيرة" runat="server"
                                            ID="PagingToolbar1">
                                        </ext:PagingToolbar>
                                    </BottomBar>
                                    <Listeners>
                                    </Listeners>
                                </ext:GridPanel>
                            </Items>
                        </ext:Panel>
                    </Items>
                </ext:Panel>
            </Items>
            <Listeners>
                <AfterRender Handler="HandelWindowSize(#{vpMailReader});" Delay="250" />
            </Listeners>
        </ext:Viewport>

Thanx in advance

[Daniil]

I would suggest you the following:

1. Set up Layout="FitLayout" for the "pnMails";

2. Set for the "pnShowMails":

2.1. Layuot="VboxLayout"
2.2. This <LayoutConfig>:

<LayoutConfig>
    <ext:VBoxLayoutConfig Align="Stretch" />
</LayoutConfig>

3. Remove AutoWidth="true" and AutoHeight="true" of both grids;

4. Set up Flex="1" for both grids.

[imaa]

Thank u very much , its work :)