如何修复嵌套在gridview中的gridview标题？

Question

我有嵌套在主gridview.I内垂直和水平滚动一个gridview已经实现水平和垂直滚动的嵌套gridview.I需要的水平和垂直滚动期间来解决这个嵌套的GridView的报头。请建议我如何做到这一点？

<asp:GridView ID="GridProjects" runat="server" AutoGenerateColumns="False" Width="100%" OnRowDataBound="GridProjects_RowDataBound" ShowFooter="true" GridLines="None" >       
     <FooterStyle CssClass="grd_footer_bg grd_row_left" /> 
     <RowStyle CssClass=" grd_odd_row grd_row_left" Wrap="false" /> 
     <HeaderStyle CssClass="grd_hdr_bg grd_row_left" Wrap="false" Font-Bold="True"/> 
     <AlternatingRowStyle CssClass="grd_evn_row grd_row_left" Wrap="false"/> 
     <Columns> 
     <asp:TemplateField HeaderStyle-CssClass="padding" ItemStyle-Width="10px"  HeaderStyle-HorizontalAlign="Left" HeaderText="Project Name"> 
      <ItemTemplate > 
       <table > 
       <tr> 
       <td> 
       <a href="javascript:switchViews('div<%# Eval("ProjectName") %>', 'one','GridProjects_GridResources_3','400', '950' , '40' ,'true');"><img id="imgdiv<%# Eval("ProjectName") %>" alt="Click to show/hide Lesson Lists" border="0" 
src="images/expand_button_white.jpg" /></a> 
&nbsp;&nbsp;&nbsp; 
</td> 
<td> <asp:Label ID="lblProjName" runat="server" Text='<%# Eval("ProjectName") %>'></asp:Label> </td> 
        </tr> 
        </table> 
         </ItemTemplate>  
       </asp:TemplateField> 
    <asp:TemplateField> 
        <ItemTemplate> 
          <tr> 
               <td colspan="3"> 
               <div style="overflow: hidden;" id="DivHeaderRow"> 
               </div> 

                <div id="div<%# Eval("ProjectName") %>" onscroll="OnScrollDiv(this)" style="display: none; overflow:auto; position:relative; left: 25px;">            
                <asp:Panel ID="pnlgrid" runat="server" Width="1309px" ScrollBars="Horizontal"> 
                 <asp:GridView ID="GridResources" runat="server" OnRowCreated="rowcreate" OnRowDataBound="GridResources_RowDataBound" CssClass="grid" Width="900px" GridLines="Vertical" 
                ShowFooter="true" AutoGenerateColumns="false" > 
                  <FooterStyle CssClass="grd_footer_bg grd_row_left" /> 
            <RowStyle CssClass="grd_odd_row grd_row_left" Wrap="False" /> 
            <EditRowStyle BackColor="#999999" /> 
            <SelectedRowStyle CssClass="grd_higlight_row grd_row_left" /> 
            <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" /> 
            <HeaderStyle CssClass="grd_hdr_bg grd_row_left fixedHeader" Font-Bold="True" HorizontalAlign="Left" 
             Wrap="False" /> 
            <AlternatingRowStyle CssClass="grd_evn_row grd_row_left" Wrap="False" /> 
                  <Columns> 
                  <%-- <asp:TemplateField> 
             <ItemTemplate> 
              <a href="javascript:switchViews('div<%# Eval("ResourceID") %>', 'one');"> 
               <img id="imgdiv<%# Eval("ResourceID") %>" alt="Click to show/hide Lesson Lists" border="0" 
                src="images/expand_button_white.jpg" /></a> 
             </ItemTemplate> 
            </asp:TemplateField> 
    <asp:TemplateField HeaderText="Vacation/Comp Off"> 
                  <ItemTemplate> 
                  <asp:TextBox ID="txtvacatcoff" MaxLength="10" Text='<%# Eval("ReasonVaction") %>' onkeypress="return AllowNumericOnly(this)" runat="server"></asp:TextBox> 
                  </ItemTemplate> 
                  </asp:TemplateField> 
                  <asp:TemplateField HeaderText="In Between Assignment"> 
                  <ItemTemplate> 
                  <asp:TextBox ID="txtinbassign" MaxLength="10" Text='<%# Eval("ReasonInBtnAssignments") %>' onkeypress="return AllowNumericOnly(this)" runat="server"></asp:TextBox> 
                  </ItemTemplate> 
                  </asp:TemplateField> 
                  <asp:TemplateField HeaderText="Internal Project"> 
                  <ItemTemplate> 
                  <asp:TextBox ID="txtintproj" MaxLength="10" Text='<%# Eval("ReasonInternalProjects") %>' onkeypress="return AllowNumericOnly(this)" runat="server"></asp:TextBox> 
                  </ItemTemplate> 
                  </asp:TemplateField> 
                  <asp:TemplateField HeaderText="Training"> 
                  <ItemTemplate> 
                  <asp:TextBox ID="txttraining" MaxLength="10" Width="80px" Text='<%# Eval("ReasonTraining") %>' onkeypress="return AllowNumericOnly(this)" runat="server"></asp:TextBox> 
                  </ItemTemplate> 
                  </asp:TemplateField> 
              <%--<asp:BoundField DataField="RevenueForecast" HeaderText="Revenue Forecast" />--%> 
               <asp:TemplateField HeaderText="Revenue Forecast"> 
                  <ItemTemplate> 
                  <asp:Label ID="lblRevenueForecast" Width="80px" Text='<%# Eval("RevenueForecast") %>' runat="server"></asp:Label> 
                  </ItemTemplate> 
                   <FooterTemplate> 
                   <asp:Label ID="lblRevenueTotal" runat="server"></asp:Label> 
                  </FooterTemplate> 
              </asp:TemplateField> 
              <asp:TemplateField HeaderText="Comments"> 
                  <ItemTemplate> 
                  <asp:TextBox ID="txtComment" MaxLength="300" Text='<%# Eval("Comment") %>' runat="server"></asp:TextBox> 
                  </ItemTemplate> 
                  </asp:TemplateField> 
            </Columns> 
             </asp:GridView> 
             </asp:Panel> 
             </div> 
             <div id="DivFooterRow" style="overflow:hidden"> 
             </div> 
             </td> 
             </tr> 

        </ItemTemplate> 
       </asp:TemplateField> 
      </Columns> 
     </asp:GridView> 

Answer 1

我已经成功使用jQuery插件tableScroll上设置一个HTML表（由一个GridView服务器控制渲染）固定报头。

要试试它，请查看演示，查找由GridView呈现的表格的客户端ID（您可能希望在GridView上设置ClientIdMode="static"，以便您的客户端ID与服务器相同-侧）。然后，你可以调用类似：

$('#GridProjects').tableScroll({height:400}); 

假设你有js文件jQuery和tableScroll脚本引用，并以tableScroll CSS文件的链接。

如果你不想设定ClientIDMode="static"，你可以设置tableScroll这样的：

$('#<%= GridProjects.ClientID %>').tableScroll({height:400});