GridPanel - GroupingView - columns alignment are not in place.

  1. #1

    GridPanel - GroupingView - columns alignment are not in place.

    Hello there

    I am using a Gridpanel and a Grouping view (Ext.net 1x) .As soon as i add the Grouping panel the columns under the headers are not aligned properly. Seems like the Gridpanel is not calculation the column length correctly. Attaching my code any help would be appreciated.

    <ext:GridPanel ID="GridPanelCoaches" runat="server" Title="Coaches" AutoExpandColumn="RouteId" Frame="true" 
                    AutoWidth="true" Height="500" AutoRender="true" AutoScroll="true" Cls="FlightSearchResults">
                    <Store>
                        <ext:Store ID="StoreCoaches" runat="server" GroupField="RouteId" AutoLoad="false">
                            <Reader>
                                <ext:JsonReader>
                                    <Fields>
                                        <ext:RecordField Name="RouteId" Type="Int" />
                                        <ext:RecordField Name="Date" Type="Date" />
                                        <ext:RecordField Name="Duration" Type="Int" />
                                        <ext:RecordField Name="NumVehicles" Type="Int" />
                                        <ext:RecordField Name="Mileage" />
                                        <ext:RecordField Name="Operator" />
                                        <ext:RecordField Name="CoachTypeRouteName" />
                                        <ext:RecordField Name="Price" />
                                        <ext:RecordField Name="CoachOptionId" Type="Int" />
                                        <ext:RecordField Name="Availability" />
                                        <ext:RecordField Name="AvailabilityStatus" />
                                    </Fields>
                                </ext:JsonReader>
                            </Reader>
                            <SortInfo Field="RouteId" Direction="ASC" />
                        </ext:Store>
                    </Store>
                    <ColumnModel runat="server" DefaultSortable="false">
                        <Columns>
                            <ext:Column DataIndex="RouteId" Hidden="true"  />
                            <ext:DateColumn DataIndex="Date" Header="Date" Format="dd/MM/yy" Groupable="false" />
                            <ext:Column DataIndex="Duration" Header="Duration" Groupable="false" Width="100" />
                            <ext:Column DataIndex="NumVehicles" Header="Num" Groupable="false" Width="100" />
                            <ext:Column DataIndex="Mileage" Header="Mileage" Groupable="false" Width="100" />
                            <ext:Column DataIndex="Operator" Header="Supplier" Groupable="false" Width="150" />
                            <ext:Column DataIndex="CoachTypeRouteName" Header="Route/Vehicle" Groupable="false" Width="200" />
                            <ext:Column DataIndex="Price" Header="Price" Groupable="false" Width="100" />
    
                            <ext:ImageCommandColumn Width="0">
                                <GroupCommands>
                                    <ext:GroupImageCommand CommandName="ShowErrata" Icon="Exclamation" RightAlign="true" Text="Errata">
                                        <ToolTip Text="Show Errata" />
                                    </ext:GroupImageCommand>
                                    <ext:GroupImageCommand CommandName="AddCoach" Icon="Add" Text="Select" RightAlign="true">
                                        <ToolTip Text="Add Coach" />
                                    </ext:GroupImageCommand>
                                </GroupCommands>
                                <PrepareGroupCommand Fn="TMSWeb.booking.search.CoachSearchResults.PrepareGroupCommand" />
                            </ext:ImageCommandColumn>
                        </Columns>
                    </ColumnModel>
                    <LoadMask ShowMask="true" />
                    <View>
                        <ext:GroupingView HideGroupedColumn="true" runat="server" ForceFit="true" ID="GroupingView1"
                            GroupTextTpl='<div>hello</div>'
                            EnableRowBody="true" EmptyText="No found matching your search" EmptyGroupText="No  found matching your search">
                            <GetRowClass Handler="return record.data.AvailabilityStatus;" />
                        </ext:GroupingView>
                    </View>
                    <BottomBar>
                        <ext:PagingToolbar runat="server" PageSize="30" StoreID="StoreCoaches" HideRefresh="True" ID="PagingToolbar1" />
                    </BottomBar>
                </ext:GridPanel>
    Last edited by Daniil; Sep 08, 2015 at 3:45 PM. Reason: Please use [CODE] tags
  2. #2
    Hi @gaurav,

    Welcome to the Ext.NET forums!

    I had to remove this piece because it throws a JavaScript error TMSWeb is undefined.
    <PrepareGroupCommand Fn="TMSWeb.booking.search.CoachSearchResults.PrepareGroupCommand" />
    After that I was able to run the code snippet in my test page. It looks like I don't see anything wrong:
    Click image for larger version. 

Name:	GridPanel.JPG 
Views:	41 
Size:	22.9 KB 
ID:	24216

    What do you see on your side? Please share a screenshot.

    Is the issue reproducible without any data bound to the GridPanel? If it is required, please provide a full test case.

    Also please tell what exactly Ext.NET version you are dealing with.

Similar Threads

  1. Replies: 6
    Last Post: Jul 11, 2012, 8:00 AM
  2. Replies: 2
    Last Post: Jun 06, 2012, 8:48 PM
  3. [CLOSED] GroupingView on multi columns
    By imaa in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: May 03, 2012, 7:48 AM
  4. Replies: 0
    Last Post: Apr 18, 2012, 8:40 AM
  5. Replies: 16
    Last Post: Sep 07, 2010, 6:31 PM

Tags for this Thread

Posting Permissions