Проблема выравнивания заголовка группы Telerik Radgrid при включении UseStaticHeaders

Я хочу заморозить заголовок столбца, чтобы установить UseStaticHeaders = True.Проблема выравнивания заголовка группы Telerik Radgrid при включении UseStaticHeaders

Но я обнаружил, что в заголовке группы была проблема выравнивания (см. Прикрепленный захват экрана).

Я пытался использовать css, но не работал.

Благодаря

код следующим образом:

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Delivery.aspx.vb" Inherits="Project_Delivery" %> 

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 

    <title></title> 
    <script type="text/javascript"> 
     var rowid = 0 

     function RowSelected(sender, args) { 
      rowid = args.getDataKeyValue("DeliveryID") 
     } 
    </script> 

<style type="text/css"> 

    * html .RadGrid .rgGroupHeader td div div 
    { 
     top:0.1em !important; 
     /*font-size:x-large !important;*/ 
     padding-top: 2em; 
     height: 20em !important; 
    } 


    </style> 

</head> 
<body> 
    <form id="form1" runat="server"> 
     <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager> 

     <asp:Panel ID="Panel1" runat="server" CssClass="subpageheader" Width="100%"> 
      Delivery (Group by Order Form No.) 
     </asp:Panel> 
      <telerik:RadToolBar ID="rtbMain" runat="server" Width="100%" OnClientButtonClicking="OnClientItemClickingHandler"> 
      <Items> 
       <telerik:RadToolBarButton Value="Add" Text="Add" Width="100px" PostBack="true" CausesValidation="false" /> 
       <telerik:RadToolBarButton IsSeparator="true" /> 
       <telerik:RadToolBarButton Value="Edit" Text="Edit" Width="100px" PostBack="true" CausesValidation="false" /> 
       <telerik:RadToolBarButton IsSeparator="true" /> 
       <telerik:RadToolBarButton Value="Delete" Text="Delete" Width="100px" CausesValidation="false" PostBack="true" /> 
       <telerik:RadToolBarButton IsSeparator="true" />    
       <telerik:RadToolBarButton Value="Refresh" Text="Refresh" Width="100px" PostBack="true" CausesValidation="false"> 
       </telerik:RadToolBarButton> 
       <telerik:RadToolBarButton IsSeparator="true" /> 
       <telerik:RadToolBarButton Value="Excel" Text="Excel" Width="100px" PostBack="true" CausesValidation="false" /> 
       <telerik:RadToolBarButton IsSeparator="true" /> 
       <telerik:RadToolBarButton Value="Copy" Text="Copy as New" Width="100px" PostBack="true" CausesValidation="false" /> 
       <telerik:RadToolBarButton IsSeparator="true"></telerik:RadToolBarButton> 
      </Items> 
     </telerik:RadToolBar> 

     <telerik:RadGrid ID="rgData" runat="server" DataSourceID="ldsDelivery" AllowFilteringByColumn="True" AllowSorting="True" AutoGenerateColumns="False" 
      GroupPanelPosition="Top" AllowPaging="True" PageSize="30" Width="3000px" Height="800px" > 

      <ClientSettings AllowRowsDragDrop="true" AllowColumnsReorder="True" AllowDragToGroup="True" ReorderColumnsOnClient="true" > 
       <Selecting AllowRowSelect="True" EnableDragToSelectRows="false" /> 
       <Selecting AllowRowSelect="True" /> 
       <ClientEvents OnRowSelected="RowSelected" /> 
       <Scrolling AllowScroll="true" UseStaticHeaders="true" /> 
      </ClientSettings> 




      <MasterTableView DataSourceID="ldsDelivery" DataKeyNames="DeliveryID" HeaderStyle-VerticalAlign="Top" AlternatingItemStyle-HorizontalAlign="Center" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center"> 
       <GroupByExpressions> 
        <telerik:GridGroupByExpression> 
         <SelectFields> 
           <telerik:GridGroupByField FieldAlias="OrderFormNo" FieldName="OrderFormNo" /> 
           <telerik:GridGroupByField FieldAlias="Accumulatives" Aggregate="Sum" FieldName="Qty" /> 
         </SelectFields> 
         <GroupByFields> 
          <telerik:GridGroupByField FieldAlias="OrderFormNo" FieldName="OrderFormNo" SortOrder="Descending" />       
         </GroupByFields> 
        </telerik:GridGroupByExpression> 
       </GroupByExpressions> 
       <GroupHeaderItemStyle Height="20px" CssClass="rgGroupHeader" /> 
       <Columns>     
        <telerik:GridBoundColumn DataField="OrderFormNo" FilterControlAltText="Filter Concrete Order Form column" HeaderText="Concrete Order Form No" SortExpression="OrderFormNo" UniqueName="OrderFormNo"> 
         <HeaderStyle Width="150px" /> 
        </telerik:GridBoundColumn>  
         <telerik:GridDateTimeColumn DataField="DeliveryDate" HeaderText="Delivery Date" FilterControlWidth="110px" 
          SortExpression="DeliveryDate" PickerType="DatePicker" EnableTimeIndependentFiltering="true" 
          DataFormatString="{0:dd-MMM-yyyy}"> 
         <HeaderStyle Width="140px" /> 
         </telerik:GridDateTimeColumn>      


        <telerik:GridBoundColumn DataField="DocketID" FilterControlAltText="Filter Docket ID column" HeaderText="Delivery Docket No" ReadOnly="True" SortExpression="DocketID" UniqueName="DocketID"> 
         <ItemStyle Width="120px" /> 
         <HeaderStyle Width="120px" /> 
        </telerik:GridBoundColumn> 
        <telerik:GridBoundColumn DataField="PourID" FilterControlAltText="Filter Pour Location column" HeaderText="Pour ID" ReadOnly="True" SortExpression="PourID" UniqueName="PourID"> 
         <ItemStyle Width="120px" /> 
         <HeaderStyle Width="120px" /> 

        </telerik:GridBoundColumn> 
         <telerik:GridBoundColumn DataField="LocationCode" FilterControlAltText="Filter LocationCode column" HeaderText="Location Code" ReadOnly="True" SortExpression="LocationCode" UniqueName="LocationCode"> 
         <ItemStyle Width="100px" /> 
         <HeaderStyle Width="100px" />      
       </Columns> 
      </MasterTableView> 
     </telerik:RadGrid> 

      <asp:LinqDataSource ID="ldsDelivery" runat="server" 
       ContextTypeName="dcConcreteDatabaseDataContext" 
       TableName="view_DeliveryList2s" OrderBy="DeliveryDate"> 
     </asp:LinqDataSource> 

     <script type="text/javascript"> 

      function OnClientItemClickingHandler(sender, args) { 
       var grid = $find("<%=rgData.ClientID%>"); 
       var gridSelectedItems = grid.get_selectedItems(); 
       var selectcount = gridSelectedItems.length; 




       var button = args.get_item(); 
       if (button.get_value() == "Delete") { 

        if (selectcount == 0) { 
         alert('Please select an item first!'); 
         eventArgs.set_cancel(true); 

        } 
        else { 
         if (confirm('Are you sure?') == false) { 
          eventArgs.set_cancel(true); 
         } 

        } 
       } 

       if (button.get_value() == "Edit") { 
        if (selectcount == 0) { 
         alert('Please select an item first!'); 
         eventArgs.set_cancel(true); 
        } 

       } 

       if (button.get_value() == "Copy") { 
        if (selectcount == 0) { 
         alert('Please select an item first!'); 
         eventArgs.set_cancel(true); 
        } 
       } 

      } 


     </script> 

    </form> 
</body> 
</html>

источник

2015-11-19 Joe Yan

Какая версия telerik? Я пробовал работать отлично. Возможно, какой-то код поможет нам идентифицировать вашу проблему. – Nic

Я попробовал ваш код .. работает нормально в моем компьютере .. Какой браузер вы используете?

Вот код ..

.aspx

<asp:ScriptManager ID="sm" runat="server"></asp:ScriptManager> 

     <telerik:RadGrid ID="rgData" runat="server" AllowFilteringByColumn="true" AllowSorting="true" AutoGenerateColumns="false" 
     GroupPanelPosition="Top" AllowPaging="true" PageSize="30" Width="3000px" Height="800px" OnNeedDataSource="rgData_NeedDataSource"> 
      <ClientSettings AllowRowsDragDrop="true" AllowColumnsReorder="true" AllowDragToGroup="true" ReorderColumnsOnClient="true" > 
       <Selecting AllowRowSelect="true" EnableDragToSelectRows="false" /> 
       <Scrolling AllowScroll="true" UseStaticHeaders="true" /> 
      </ClientSettings> 
     <MasterTableView DataKeyNames="DeliveryID" HeaderStyle-VerticalAlign="Top" 
      AlternatingItemStyle-HorizontalAlign="Center" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center"> 
      <GroupByExpressions> 
       <telerik:GridGroupByExpression> 
        <SelectFields> 
          <telerik:GridGroupByField FieldAlias="OrderFormNo" FieldName="OrderFormNo" /> 
          <telerik:GridGroupByField FieldAlias="Accumulatives" Aggregate="Sum" FieldName="Qty" /> 
        </SelectFields> 
        <GroupByFields> 
         <telerik:GridGroupByField FieldAlias="OrderFormNo" FieldName="OrderFormNo" SortOrder="Descending" />       
        </GroupByFields> 
       </telerik:GridGroupByExpression> 
      </GroupByExpressions> 
      <GroupHeaderItemStyle Height="20px" CssClass="rgGroupHeader" /> 
      <Columns>     
       <telerik:GridBoundColumn DataField="OrderFormNo" FilterControlAltText="Filter Concrete Order Form column" HeaderText="Concrete Order Form No" SortExpression="OrderFormNo" UniqueName="OrderFormNo"> 
        <HeaderStyle Width="150px" /> 
       </telerik:GridBoundColumn>  
        <telerik:GridDateTimeColumn DataField="DeliveryDate" HeaderText="Delivery Date" FilterControlWidth="110px" 
         SortExpression="DeliveryDate" PickerType="DatePicker" EnableTimeIndependentFiltering="true" 
         DataFormatString="{0:dd-MMM-yyyy}"> 
        <HeaderStyle Width="140px" /> 
        </telerik:GridDateTimeColumn>      


       <telerik:GridBoundColumn DataField="DocketID" FilterControlAltText="Filter Docket ID column" HeaderText="Delivery Docket No" ReadOnly="True" SortExpression="DocketID" UniqueName="DocketID"> 
        <ItemStyle Width="120px" /> 
        <HeaderStyle Width="120px" /> 
       </telerik:GridBoundColumn> 
       <telerik:GridBoundColumn DataField="PourID" FilterControlAltText="Filter Pour Location column" HeaderText="Pour ID" ReadOnly="True" SortExpression="PourID" UniqueName="PourID"> 
        <ItemStyle Width="120px" /> 
        <HeaderStyle Width="120px" /> 

       </telerik:GridBoundColumn> 
       <telerik:GridBoundColumn DataField="LocationCode" FilterControlAltText="Filter LocationCode column" HeaderText="Location Code" ReadOnly="True" SortExpression="LocationCode" UniqueName="LocationCode"> 
        <ItemStyle Width="100px" /> 
        <HeaderStyle Width="100px" /> 
       </telerik:GridBoundColumn>     
      </Columns> 
     </MasterTableView> 
    </telerik:RadGrid>

.css

* html .RadGrid .rgGroupHeader td div div 
{ 
     top:0.1em !important; 
     /*font-size:x-large !important;*/ 
     padding-top: 2em; 
     height: 20em !important; 
}

.cs

protected void Page_Load(object sender, EventArgs e) 
{ 
    // Check 
    if(!IsPostBack) 
    { 
     // Variable 
     DataTable dt = new DataTable(); 

     // Create Column 
     dt.Columns.Add("DeliveryID", typeof(int)); 
     dt.Columns.Add("OrderFormNo", typeof(int)); 
     dt.Columns.Add("Qty", typeof(int)); 
     dt.Columns.Add("DeliveryDate", typeof(DateTime)); 
     dt.Columns.Add("DocketID", typeof(int)); 
     dt.Columns.Add("PourID", typeof(int)); 
     dt.Columns.Add("LocationCode", typeof(string)); 

     // Dummy Variable 
     int[] deliveryID = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
     int[] orderFormNo = { 1, 1, 1, 2, 2, 2, 3, 3, 3, 4 }; 
     int[] qty = { 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 }; 
     DateTime[] deliveryDate = { DateTime.Now, DateTime.Now.AddDays(1), DateTime.Now.AddDays(2), DateTime.Now.AddDays(3), 
            DateTime.Now.AddDays(4), DateTime.Now.AddDays(5), DateTime.Now.AddDays(6), DateTime.Now.AddDays(7), 
            DateTime.Now.AddDays(8), DateTime.Now.AddDays(9) }; 
     int[] docketID = { 1000, 1001, 1002, 1003, 1004, 1005, 1006, 1007, 1008, 1009 }; 
     int[] pourID = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
     string[] locationCode = { "A1", "A2", "A3", "A4", "A5", "A6", "A7", "A8", "A9", "A10" }; 

     for (int i = 0; i < deliveryID.Length; i++) 
      dt.Rows.Add(deliveryID[i], orderFormNo[i], qty[i], deliveryDate[i], docketID[i], pourID[i], locationCode[i]); 

     // ViewState 
     ViewState["Data"] = dt; 

     // Bind 
     rgData.DataSource = dt; 
     rgData.DataBind(); 
    } 
} 

protected void rgData_NeedDataSource(object sender, GridNeedDataSourceEventArgs e) 
{ 
    rgData.DataSource = ViewState["Data"] as DataTable; 
}

Результат

источник

2015-11-23 06:31:45 Nic

Привет, я пробовал IE9, IE11, firefox version 42.0 ... у всех из них была проблема выравнивания –

@JoeYan Тогда я не могу помочь вам вызвать, если я не могу реплицировать тот же сценарий я не могу вам помочь ... – Nic

nevermind, thx много. –

Проблема выравнивания заголовка группы Telerik Radgrid при включении UseStaticHeaders

ответ

Смежные вопросы