停止GridView标题滚动

时间:2014-07-22 15:19:17

标签: c# javascript jquery css asp.net

这是我的ASPX代码:

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="xyz.aspx.cs" Inherits="xyz" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
<div style=" font-size:x-small; overflow:auto; width:660px; height:180px; ">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4"
        ForeColor="#333333" GridLines="None" ShowHeader="true" DataSourceID="SqlDataSource1" onrowcommand="GridView1_RowCommand">
        <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
        <Columns>
            <asp:TemplateField HeaderText="SR No"><ItemTemplate><%# Container.DataItemIndex + 1 %></ItemTemplate></asp:TemplateField>
            <asp:BoundField DataField="test_1" HeaderText="First No" SortExpression="test_1" />
            <asp:BoundField DataField="test_2" HeaderText="Second No" SortExpression="test_2" />
        </Columns>
        <EditRowStyle BackColor="#999999" />
        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
        <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
        <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
        <SortedAscendingCellStyle BackColor="#E9E7E2" />
        <SortedAscendingHeaderStyle BackColor="#506C8C" />
        <SortedDescendingCellStyle BackColor="#FFFDF8" />
        <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
    </asp:GridView>
</div>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:paconn %>"
SelectCommand="SELECT * FROM [c_test] ORDER BY [test_1]">
</asp:SqlDataSource>
</asp:Content>

我希望我的GridView标头固定在它们的位置,其他数据垂直滚动。

1 个答案:

答案 0 :(得分:0)

我已经花了几百个小时。答案,我已经决定是两个网格视图。一个用于标题,一个用于数据,在可滚动的div中。每个都使用相同的样式。确定屏幕大小并将div设置为固定的高度和宽度,并将网格视图设置为比div窄20px。在其中一个网格视图的PreRender事件上,将两个网格视图的列宽设置为相同。最后,我有完美大小的网格视图,用一个静态标题和完美对齐的列填充页面(或出现在我想要的位置)。您可以在gridview标题列中添加可用于排序等的控件。