Grid Panel Alignment Issue

[pooja]

Hi

I have a page with multiple girds. each of the grid has a toolbar in which there is a add button to add data to the grid.
The issue is when open the page all the grids are aligned properly to 100% width. but when I add data and the grid rebinds the alignment of the grid is disturbed.

PFA screenshots for the same.

<ext:Store ID="storeAttachment" runat="server">
                                    <AutoLoadParams>
                                        <ext:Parameter Name="start" Value="0" Mode="Raw" />
                                        <ext:Parameter Name="limit" Value="10" Mode="Raw" />
                                    </AutoLoadParams>
                                    <Reader>
                                        <ext:JsonReader IDProperty="AttachmentID">
                                            <Fields>
                                                <ext:RecordField Mapping="AttachmentID" Name="AttachmentID" Type="Int" />
                                                <ext:RecordField Mapping="AttachmentName" Name="AttachmentName" Type="String" />
                                                <ext:RecordField Mapping="AttachmentDate" Name="AttachmentDate" Type="Date" />
                                                <ext:RecordField Mapping="AttachmentFile" Name="AttachmentFile" Type="String" />
                                            </Fields>
                                        </ext:JsonReader>
                                    </Reader>
                                </ext:Store>

                                <ext:GridPanel ID="grdpnlattachement" runat="server" AnimCollapse="true" Collapsible="true"
                                    Height="350" Title="Attachments" StoreID="storeAttachment">
                                    <View>
                                        <ext:GridView ID="GridView8" runat="server" ForceFit="true" MarkDirty="false" ScrollOffset="0">
                                        </ext:GridView>
                                    </View>
                                    <TopBar>
                                        <ext:Toolbar ID="Toolbar6" runat="server">
                                            <Items>
                                                <ext:Button ID="btnAddAttachment" runat="server" Flat="true" Icon="Add" Text="Add Attachment">
                                                    <Listeners>
                                                        <Click Handler="#{BasicForm}.getForm().reset();#{wAttachment}.show();" />
                                                    </Listeners>
                                                </ext:Button>
                                                <ext:ToolbarFill ID="ToolbarFill5" runat="server">
                                                </ext:ToolbarFill>
                                                <ext:PagingToolbar ID="PagingToolbar8" runat="server" HideRefresh="true" LabelAlign="Left"
                                                    PageIndex="0" PageSize="10" StoreID="storeAttachment">
                                                </ext:PagingToolbar>
                                            </Items>
                                        </ext:Toolbar>
                                    </TopBar>
                                    <ColumnModel>
                                        <Columns>
                                            <ext:Column Align="left" ColumnID="colAttachmentID" DataIndex="AttachmentID" Header="Attachment ID"
                                                Resizable="false" Width="0" Hidden="true">
                                            </ext:Column>
                                            <ext:Column Align="left" ColumnID="colAttachmentName" DataIndex="AttachmentName"
                                                Header="Attachment Name" Resizable="false" Width="100">
                                            </ext:Column>
                                            <ext:DateColumn Align="Right" ColumnID="colDate" DataIndex="AttachmentDate" Header="Date"
                                                Resizable="false" Width="100" Format="dd/MM/yyyy">
                                            </ext:DateColumn>
                                            <ext:Column Align="left" ColumnID="colLink" DataIndex="AttachmentFile" Header="Attachment"
                                                Resizable="false" Width="100">
                                                <Renderer Fn="LinkDetails" />
                                            </ext:Column>
                                            <ext:ImageCommandColumn ColumnID="colDelete" Align="Center" Width="20" Header="Delete">
                                                <Commands>
                                                    <ext:ImageCommand CommandName="DeleteAttachment" Icon="Delete">
                                                        <ToolTip Text="Delete" />
                                                    </ext:ImageCommand>
                                                </Commands>
                                            </ext:ImageCommandColumn>
                                        </Columns>
                                    </ColumnModel>
                                    <Listeners>
                                        <Command Handler="BtnGridClick(command, record.data)" />
                                    </Listeners>
                                </ext:GridPanel>