【问题标题】:Fixed Header Grid View ASP.NET固定标题网格视图 ASP.NET
【发布时间】:2012-08-23 04:55:58
【问题描述】:

我浏览了很多固定标题网格视图的示例,并尝试了一些使用 div 和 java 脚本的选项。我没有从示例中工作的那个,这里有什么我想念的吗?

 CSS 
.gridViewHeader
{
     background-color:Navy;
    color:blue;
    font-size:12px;
    font-weight:bold;
    position:relative;
    z-index:10;
   top:expression(<%= gv.HeaderRow %>.offsetParent.scrollTop-2);
}

design source
<table>
<tr>
            <td>
                &nbsp;
            </td>
        </tr>
    </table>
    <div>
        <asp:GridView ID="gv" runat="server" CellPadding="4" PageSize="50" RowHeaderColumn="True"
            AllowPaging="True" BackColor="White" BorderColor="#3366CC" BorderStyle="None"
            BorderWidth="1px" CssClass="gridViewHeader">
            <PagerSettings Mode="NumericFirstLast" />
            <PagerStyle BackColor="#99CCCC" ForeColor="#003399" HorizontalAlign="Left" VerticalAlign="Middle" />
            <RowStyle BackColor="White" ForeColor="#003399" BorderStyle="Inset" HorizontalAlign="Center"
                VerticalAlign="Middle" Wrap="False" />
            <SelectedRowStyle BackColor="#009999" Font-Bold="True" ForeColor="#CCFF99" />
        </asp:GridView>
    </div>
        <asp:HiddenField ID="hiddenfield1" runat="server"  />
    </asp:Content>

【问题讨论】:

    标签: c# asp.net html gridview


    【解决方案1】:

    此 CSS 将解决您的问题:

    .GVFixedHeader { font-weight:bold; background-color: Green; position:relative; 
                 top:expression(this.parentNode.parentNode.parentNode.scrollTop-1);}
    

    【讨论】:

    • 我试过这个选项,但标题也在移动,它冻结了网格视图上方的
    • 您使用的是什么浏览器?如果标题正在移动,则删除顶部:表达式并使用 .GVFixedHeader { font-weight:bold;背景颜色:绿色;位置:相对; }
    【解决方案2】:

    我就是这么做的。我用这篇文章作为参考。

    http://csharpdotnetfreak.blogspot.com/2009/07/scrollable-gridview-fixed-headers-asp.html

    诀窍是创建一个表格,然后将网格放置在该表格下方的一个 div 中。将细节单元格的宽度设置为与 gridview 中的单元格相同的宽度。然后确保滚动条保持打开状态,如果没有足够的行来实际需要滚动功能,网格和表格将对齐。

    【讨论】:

    • 您好,此选项会导致标题和行详细信息的宽度出现错误。标题和列是动态创建的。标题和详细信息列未正确对齐
    • 对,您必须在 gridview 中定义每个结果的宽度,以使其正确排列。
    【解决方案3】:

    你可以使用

    <HeaderStyle CssClass="gridViewHeader" />
    

    为您的样品

    <asp:GridView ID="gv" runat="server" CellPadding="4" PageSize="50" RowHeaderColumn="True"
                AllowPaging="True" BackColor="White" BorderColor="#3366CC" BorderStyle="None"
                BorderWidth="1px" >
    
                <HeaderStyle CssClass="gridViewHeader" />
    
                <PagerSettings Mode="NumericFirstLast" />
                <PagerStyle BackColor="#99CCCC" ForeColor="#003399" HorizontalAlign="Left" VerticalAlign="Middle" />
                <RowStyle BackColor="White" ForeColor="#003399" BorderStyle="Inset" HorizontalAlign="Center"
                    VerticalAlign="Middle" Wrap="False" />
                <SelectedRowStyle BackColor="#009999" Font-Bold="True" ForeColor="#CCFF99" />
            </asp:GridView>
    

    【讨论】:

    • 感谢 Candie 的回答,我尝试了该选项,但标题也向上移动,但不固定
    • 我很乐意为您提供帮助,但在这种情况下,我认为您的 css 有问题,因为 是一个很好的答案
    猜你喜欢
    • 2013-07-03
    • 2013-11-17
    • 2013-06-25
    • 1970-01-01
    • 2012-09-07
    • 2014-02-23
    • 1970-01-01
    • 2012-09-08
    • 1970-01-01
    相关资源
    最近更新 更多