解决在中继器中的标题行在ASP.NET中

我想弄清楚如何解决使用asp.net中继器中的标题行。试图摆位置时：固定;在tr标签中。它似乎修复它，但它变得更小，不适用于桌子的其余部分。解决在中继器中的标题行在ASP.NET中

任何提示或帮助正确的方向将有助于显着！

感谢

<div class="form-panel" style="font-size: small; text-align: left;"> 
    <div class="header"> 
     <div class="contentRestriction" style="height: 22px"> 
      Action Bulletin Exception 
      <asp:button id="addException" text="Add Exception" runat="server" style="float: right; margin-right: 20px" onclick="addExceptions" /> 
     </div> 
    </div> 
    <div class="commands"> 
     <div class="contentRestriction" style="overflow-y: scroll; width: 100%; height: 185px"> 
      <asp:repeater id="repException" runat="server" datasourceid="SP_AB_BULLETIN_EXCEPTION"> 
         <HeaderTemplate> 
          <div class="form-panel" style="font-size: small;"> 
           <table class="notepad-table" cellpadding="2" cellspacing="0" width="100%" > 
            <tr style="background-color: #eeeeee; font-weight: bold; ">         
             <td>Date Time From</td> 
             <td>Date Time To</td> 
             <td>Status</td> 
             <td>Last Modified</td> 
             <td>Last Modified By</td> 
             <td>Action</td> 
            </tr> 
         </HeaderTemplate> 
         <ItemTemplate> 
          <tr id="tr1" runat="server"> 
           <td> 
            <asp:Literal ID="Literal1" runat="server" Text='<%# Eval("EFTV_FROM") %>' /> 
           </td> 
           <td> 
            <asp:Literal ID="Literal2" runat="server" Text='<%# Eval("EFTV_TO") %>' /> 
           </td> 
           <td> 
            <asp:Literal ID="Literal3" runat="server" Text='<%# Eval("AB_STATUS1") %>' /> 
           </td> 
           <td> 
            <asp:Literal ID="Literal4" runat="server" Text='<%# Eval("LAST_MOD_DATE") %>' /> 
           </td> 
           <td> 
            <asp:Literal ID="Literal6" runat="server" Text='<%# Eval("UserName") %>' /> 
           </td> 
           <td> 
            <asp:Button ID="editException" Text="Edit" runat="server" CommandName="EXID" CommandArgument='<%# Eval("EX_ID") %>' OnCommand="editException" /> 
            <asp:Button ID="deleteException" Text="Delete" runat="server" CommandName="EXID" CommandArgument='<%# Eval("EX_ID") %>' OnCommand="deleteException" /> 
           </td> 

          </tr> 
         </ItemTemplate> 
         <FooterTemplate> 
      </table> 
     </div> 
     </FooterTemplate> 
        </asp:Repeater>  
    </div> 
</div> 
</div>

来源

2016-07-29 D B

查看http://stackoverflow.com/questions/11891065/css-only-scrollable-table-with-fixed-headers – VDWWD

要获得固定头的效果，你可以做两个小的改动你的代码。

1）在你的页面的<head>部分粘贴以下样式规则：

<div class="commands"> 
       <asp:Repeater ID="repException" runat="server" DataSourceID="SP_AB_BULLETIN_EXCEPTION"> 
        <HeaderTemplate> 
         <div class="form-panel" style="font-size: small;"> 
          <table class="notepad-table" cellpadding="2" cellspacing="0"> 
           <thead> 
            <tr style="background-color: #eeeeee; font-weight: bold;"> 
             <th>Date Time From</th> 
             <th>Date Time To</th> 
             <th>Status</th> 
             <th>Last Modified</th> 
             <th>Last Modified By</th> 
             <th>Action</th> 
            </tr> 
           </thead> 
           <tbody> 
        </HeaderTemplate> 
        <ItemTemplate> 
         <tr id="tr1" runat="server"> 
          <td> 
           <asp:Literal ID="Literal1" runat="server" Text='<%# Eval("EFTV_FROM") %>' /> 
          </td> 
          <td> 
           <asp:Literal ID="Literal2" runat="server" Text='<%# Eval("EFTV_TO") %>' /> 
          </td> 
          <td> 
           <asp:Literal ID="Literal3" runat="server" Text='<%# Eval("AB_STATUS1") %>' /> 
          </td> 
          <td> 
           <asp:Literal ID="Literal4" runat="server" Text='<%# Eval("LAST_MOD_DATE") %>' /> 
          </td> 
          <td> 
           <asp:Literal ID="Literal6" runat="server" Text='<%# Eval("UserName") %>' /> 
          </td> 
          <td> 
           <asp:Button ID="editException" Text="Edit" runat="server" CommandName="EXID" CommandArgument='<%# Eval("EX_ID") %>' OnCommand="editException" /> 
           <asp:Button ID="deleteException" Text="Delete" runat="server" CommandName="EXID" CommandArgument='<%# Eval("EX_ID") %>' OnCommand="deleteException" /> 
          </td> 

         </tr> 
        </ItemTemplate> 
        <FooterTemplate> 
         </tbody> 
          </table> 
          </div> 
        </FooterTemplate> 
       </asp:Repeater> 
      </div>

输出：

<style type="text/css"> 
    table tbody, table thead { 
     display: block; 
    } 

    table tbody { 
     overflow: auto; 
     height: 100px; 
    } 

    th, td { 
     width: 150px; 
    } 
</style>

2）与下面的一个替换您<div class="commands">

来源

2016-07-29 19:59:12

解决在中继器中的标题行在ASP.NET中

回答

相关问题