How to have a Fixed Header in a Gridview?

asp.net, gridview

Solution

i wrote jQuery plug-in can fixed header and freeze column, it can be apply to GridView. see the image:

look the website: http://gridviewscroll.aspcity.idv.tw/

Supported Browsers

- Internet Explorer 7, 8 (IE 9 Compatibility)

- Internet Explorer 9 (9.0.8112)

- Internet Explorer 10 on Windows 7 Preview

- Google Chrome(23.0.1271.64 m)

- Mozilla Firefox (16.0.2)

- Apple Safari (5.1.7)

Problem

I have this current implementation from a friend of mind. The project has a GridView as shown below ``` <div ID="divGrid" runat="server"> <asp:GridView ID="docGrid" runat="server" AutoGenerateColumns="False" GridLines="None" DataSourceID="pagedDatasetSourceControl" OnRowDataBound="docGrid_RowDataBound" OnSelectedIndexChanging="docGrid_SelectedIndexChanging" DataKeyNames="ID" CssClass="gridTable" AllowSorting="True" AllowPaging="True" meta:resourcekey="docGridResource1"> <PagerSettings Visible="false"></PagerSettings> <Columns> .................. </Columns> <RowStyle CssClass="tableRow"></RowStyle> <PagerStyle VerticalAlign="Bottom" HorizontalAlign="Right"></PagerStyle> <AlternatingRowStyle CssClass="tableRowAlt"></AlternatingRowStyle> </asp:GridView> </div> ``` Now, more that one (1) .cs classes using this GridView, then each implementation is different. Then "ONE" of the .cs class implements a "scrolling" which is shown below. ``` this.divGrid.Attributes.Add("class", "fleft scroll"); this.divGrid.Attributes.Add("style", "width:100%; height:250px;"); ``` But the code above scrolls the header as well, so when I scroll down the header scrolls as well. Is there a way to fix this issue by adding an "Attributes" in my .cs file for this class. Thanks

Original source

Related problems