asp.net - Telerik RadGrid グループ ヘッダーの配置 (静的グリッド ヘッダーを使用)?

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」に設定しています。パーセンテージの代わりに特定のヘッダー幅も使用しています。

radGrid のサイズを変更するときは、1 列の幅を残すのが最善です。これは、私が取り組んでいたグリッドには当てはまらないことに気付きました。1 つの列の幅を削除すると、ヘッダーがすぐに正しく配置されました。

この解決策がうまくいくかどうかはわかりませんが、私にとってはうまくいきました。

アップデート

これは、私が取り組んできたグリッドの 1 つのマークアップです。

    <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>