[CLOSED] GridPanel Layout Issue

[alliedwallet.com]

I have a page in master page with the following layout:

<form id="Search" runat="server">
    <div style="padding:10px;">
        <div class="page-title">Search</div>
            
        <ext:Panel runat="server" BodyBorder="false" StyleSpec="padding-top:10px;">
            <LayoutConfig>
                <ext:ColumnLayoutConfig FitHeight="false" Split="false" Margin="10" />
            </LayoutConfig>
            <Items>
                <ext:Panel ID="Criteria" runat="server" Width="250" Title="Criteria" Layout="Form" LabelAlign="Top" Padding="10" Icon="Magnifier">
                    <Items>
                    </Items>
                    <Buttons>
                        <ext:Button ID="SearchBtn" runat="server" Text="Search" Icon="Magnifier">
                            <DirectEvents>
                                <Click OnEvent="SearchClick">
                                    <EventMask ShowMask="true" Msg="Please wait..." />
                                </Click>
                            </DirectEvents>
                        </ext:Button>
                    </Buttons>
                </ext:Panel>
                <ext:Panel runat="server" Layout="Fit">
                    <Items>
                        <ext:GridPanel ID="Results" runat="server" Title="Results" AutoExpandColumn="FirstName" TrackMouseOver="true" StripeRows="true" Icon="MagnifierZoomIn">
                            <Store>
                                <ext:Store runat="server">
                                    <Reader>
                                        <ext:JsonReader>
                                            <Fields>
                                                <ext:RecordField Name="FirstName" />
                                                <ext:RecordField Name="LastName" />
                                            </Fields>
                                        </ext:JsonReader>
                                    </Reader>
                                </ext:Store>
                            </Store>
                            <ColumnModel>
                                <Columns>
                                    <ext:Column ColumnID="FirstName" DataIndex="FirstName" Header="First Name" />
                                    <ext:Column ColumnID="LastName" DataIndex="LastName" Header="Last Name" />
                                </Columns>
                            </ColumnModel>
                            <SelectionModel>
                                <ext:RowSelectionModel runat="server" SingleSelect="true" />
                            </SelectionModel>
                        </ext:GridPanel>
                    </Items>
                </ext:Panel>
            </Items>
        </ext:Panel>
    </div>
</form>

I can't get the panel surrounding the grid OR the grid itself to expand to the width of the page on the first load of the page (which it will contain no data to start). What do I need to do to accomplish this?

It looks like the attached document.

Thanks.

[Daniil]

Hi,

Please clarify what was the reason to use FitHeight="false"?

FitHeight="true" should help.

[alliedwallet.com]

Changing the column layout FitHeight="true" causes the panels to shrink and not show all contents that are in other columns. Like in this post:
http://forums.ext.net/showthread.php...D-Layout-issue

Basically, we want the height to be auto, but the width to fit the width of the page. But, it isn't doing that.

[Daniil]

I think you need to set up ColumnWidth="1" for the Panel which is the second item of the Panel with a ColumnLayout.

[alliedwallet.com]

Setting ColumnWidth=1 worked.

I tried everything except that.

Thanks again. You guys are the best!