Question

当我不使用静态标头时，我的RadGrid中的组头正确对齐，但是当我这样做时，它们会不对齐。似乎无法找到解决此问题的任何事情。相关代码，省略了不重要的细节：

<telerik:RadGrid runat="server" ID="RadGrid1" GridLines="None" AllowSorting="True" AutoGenerateColumns="False" AllowMultiRowSelection="True" OnNeedDataSource="RadGrid1_NeedDataSource">
    <MasterTableView DataKeyNames="PageID">
        <GroupHeaderTemplate>
                <asp:CheckBox runat="server" ID="cbGroupHeader"/>
                <asp:Label runat="server" ID="lblGroupHeader" Text='<%# (((GridGroupHeaderItem)Container).AggregatesValues["Group"]) %>'/>
        </GroupHeaderTemplate>

        <Columns>
            <telerik:GridClientSelectColumn HeaderStyle-Width="2.5%"/>
            <telerik:GridBoundColumn DataField="PageName" HeaderText="Page Name" UniqueName="PageName"/>
            <telerik:GridBoundColumn DataField="PageID" Display="False" ReadOnly="True" UniqueName="PageID"
            ...
        </Columns>

        <GroupByExpressions>
            <telerik:GridGroupByExpression>
                <GroupByFields>
                    <telerik:GridGroupByField FieldName="Order"/>
                </GroupByFields>
                <SelectFields>
                    <telerik:GridGroupByField FieldName="Group"/>
                </SelectFields>
            </telerik:GridGroupByExpression>
        </GroupByExpressions>
    </MasterTableView>

    <ClientSettings AllowKeyboardNavigation="True" AllowColumnsReorder="True" ReorderColumnsOnClient="False">
        <Selecting AllowRowSelect="True"/>
        <Resizing AllowColumnResize="True" ResizeGridOnColumnResize="False" ClipCellContentOnResize="True" EnableRealTimeResize="True" AllowResizeToFit="True"/>
        <Scrolling AllowScroll="True" UseStaticHeaders="True" SaveScrollPosition="True"/>
    </ClientSettings>
</telerik:radGrid>

图片（imgur）：

UseStaticHeaders="False"

UseStaticHeaders="True"

Answer 1

我刚遇到类似的问题。

我正在使用的网站有radGrids，当重新调整浏览器窗口大小时，它会重新调整大小。当浏览器窗口大小很小时，radGrid标题看起来很正常，但随着浏览器大小的增加而变得不对齐。

我将UseStaticHeaders设置为“true”并将TableLayout设置为“fixed”。我也使用特定的标题宽度而不是百分比。

重新调整radGrids的大小时，最好不要使用一列的宽度。我注意到在我工作的网格上并非如此。当我删除一列的宽度时，标题会立即正确对齐。

我不确定这个解决方案是否适合您，但它对我有用。

<强>更新

这是我正在研究的其中一个网格的标记：

    <telerik:RadGrid ID="grdItems" runat="server" OnNeedDataSource="grdItems_NeedDataSource" AutoGenerateColumns="False" Width="100%" Height="100%"
        GridLines="None" EnableOutsideScripts="True" PagerStyle-AlwaysVisible="true" PagerStyle-Mode="NextPrevAndNumeric" AllowPaging="true" PageSize="250" 
        AllowSorting="true" OnItemCreated="grdItems_ItemCreated" OnItemCommand="grdItems_ItemCommand" OnPreRender="grdItems_PreRender" TabIndex="17"
        OnItemDataBound="grdItems_ItemDataBound" >
        <ClientSettings AllowColumnsReorder="true" ReorderColumnsOnClient="true" ColumnsReorderMethod="reorder">
            <Selecting AllowRowSelect="False" />
            <Scrolling AllowScroll="True" UseStaticHeaders="True" />
            <Resizing AllowColumnResize="True" ClipCellContentOnResize="true" EnableRealTimeResize="true" ResizeGridOnColumnResize="true" />
        </ClientSettings>
        <MasterTableView CommandItemDisplay="Top" ClientDataKeyNames="ei_pk" DataKeyNames="ei_pk,ei_eco_fk" AllowAutomaticInserts="True" GridLines="None" TableLayout="fixed" HeaderStyle-Wrap="false" ItemStyle-Wrap="false">
            <CommandItemTemplate>
                <a href="#" onclick="return ShowAddForm();"><asp:Image ID="AddItem" runat="server" ImageUrl="~/RadControls/Grid/Skins/Office2007/AddRecord.gif" AlternateText="Add Item" /><asp:Label ID="lblAddItem" runat="server" Text="Add Item" /></a>
            </CommandItemTemplate> 
            <Columns>
                <telerik:GridTemplateColumn UniqueName="Edit" Visible="False" Resizable="false" Reorderable="false">
                    <ItemTemplate>                           
                        <asp:HyperLink ID="EditLink" runat="server" Text="Edit" ImageUrl="../RadControls/Grid/Skins/Office2007/Edit.gif" />                                
                    </ItemTemplate>
                    <HeaderStyle Width="20" />
                    <ItemStyle HorizontalAlign="Center" />
                </telerik:GridTemplateColumn>    
                <telerik:GridButtonColumn Resizable="false" Reorderable="false" ConfirmText="Are you sure you want to delete this item?" UniqueName="Delete" CommandName="Delete" Visible="False" ButtonType="ImageButton" ImageUrl="../RadControls/Grid/Skins/Office2007/Delete.gif">
                    <HeaderStyle Width="20"/>
                    <ItemStyle HorizontalAlign="Center" />
                </telerik:GridButtonColumn> 
                <telerik:GridBoundColumn HeaderText="Trade" DataField="ftr_description" UniqueName="ftr_description" />
                <telerik:GridBoundColumn HeaderText="Cost Type" DataField="combined_itemType" UniqueName="combined_itemType" />
                <telerik:GridBoundColumn HeaderText="Est. Type" DataField="etp_code" UniqueName="etp_code" />
                <telerik:GridBoundColumn HeaderText="Item Code" DataField="combined_code" UniqueName="combined_code" />
                <telerik:GridBoundColumn HeaderText="Quantity" DataField="ei_quantity" UniqueName="ei_quantity">
                    <HeaderStyle Width="50" HorizontalAlign="Center" />
                    <ItemStyle HorizontalAlign="Right" />
                </telerik:GridBoundColumn>                       
                <telerik:GridBoundColumn HeaderText="Unit Cost" DataField="ei_unitCostworking" UniqueName="ei_unitCostworking" >
                    <HeaderStyle Width="75" HorizontalAlign="Center" />
                    <ItemStyle HorizontalAlign="Right" />
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn HeaderText="Total Cost" DataField="ei_extendedCostWorking" UniqueName="ei_extendedCostWorking" DataFormatString="{0:#0.00}">
                    <HeaderStyle Width="80" HorizontalAlign="Center" />
                    <ItemStyle HorizontalAlign="Right" />
                </telerik:GridBoundColumn>                            
                <telerik:GridBoundColumn HeaderText="Budget" DataField="ei_budgetworking" UniqueName="ei_budgetworking">
                    <HeaderStyle Width="80" HorizontalAlign="Center" />
                    <ItemStyle HorizontalAlign="Right" />
                </telerik:GridBoundColumn>
                <telerik:GridHyperLinkColumn HeaderText="Change Order" DataTextField="eco_number" UniqueName="eco_number" DataNavigateUrlFields="eco_number" SortExpression="eco_number">
                    <HeaderStyle Width="104" />
                </telerik:GridHyperLinkColumn>
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>

Telerik RadGrid组头对齐（带静态网格头）？

1 个答案: