I've searched and tried to apply the solution for visible headers in gridview, when scrolling... but im having no luck... so i have you can help me out...
I have a simple gridview, but i would like the column headers of the table to stay static, is there anyway i can achieve this?
sam233
Member
36 Points
218 Posts
Visible Headers with scrolling - GRIDVIEW
Dec 06, 2012 12:04 PM|LINK
I've searched and tried to apply the solution for visible headers in gridview, when scrolling... but im having no luck... so i have you can help me out...
I have a simple gridview, but i would like the column headers of the table to stay static, is there anyway i can achieve this?
thanks,
scripts attached.
<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Master.Master" CodeBehind="PatientList.aspx.vb" Inherits="Chaplaincy.PatientList" %> <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server"> </asp:Content> <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> <form id="form1" runat="server"> <div style="height: 450px; overflow-y: scroll"> <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="IDENTIFIER" DataSourceID="NCRSDB" GridLines="None" AllowPaging="false" CssClass="mGrid" PagerStyle-CssClass="pgr" AlternatingRowStyle-CssClass="alt" PageSize="20"> <Columns> <asp:BoundField DataField="IDENTIFIER" HeaderText="IDENTIFIER" ReadOnly="True" SortExpression="IDENTIFIER" /> <asp:BoundField DataField="FORENAME" HeaderText="FORENAME" SortExpression="FORENAME" /> <asp:BoundField DataField="SURNAME" HeaderText="SURNAME" SortExpression="SURNAME" /> <asp:BoundField DataField="DESCRIPTION" HeaderText="DESCRIPTION" SortExpression="DESCRIPTION" /> <asp:BoundField DataField="RATING" HeaderText="RATING" SortExpression="RATING" /> </Columns> </asp:GridView> </div> <asp:SqlDataSource ID="NCRSDB" runat="server" ConnectionString="<%$ ConnectionStrings:NCRSDBConnectionString %>" SelectCommand="SELECT IDENTIFIER, FORENAME, SURNAME, DESCRIPTION, RATING FROM [AR_20120209_ChaplaincyPatientList] order by id desc "></asp:SqlDataSource> </form> </asp:Content>alankarp
Contributor
2042 Points
345 Posts
Re: Visible Headers with scrolling - GRIDVIEW
Dec 06, 2012 12:09 PM|LINK
Hi,
Please see links below
http://www.aspsnippets.com/Articles/Scrollable-GridView-with-Fixed-Headers-in-ASP.Net.aspx
http://www.aspsnippets.com/Articles/Scrollable-GridView-with-Fixed-Headers-and-Client-Side-Sorting-using-jQuery-in-ASP.Net.aspx
http://weblogs.asp.net/dwahlin/archive/2007/07/31/freeze-asp-net-gridview-headers-by-creating-client-side-extenders.aspx
http://csharpdotnetfreak.blogspot.com/2009/07/scrollable-gridview-fixed-headers-asp.html
Thanks
Alankar
Profile
sam233
Member
36 Points
218 Posts
Re: Visible Headers with scrolling - GRIDVIEW
Dec 07, 2012 07:42 AM|LINK
Hi Alankarp,
I have been through a number of links (even the ones you suggested) but im still having issues?
sarathi125
Star
13599 Points
2691 Posts
Re: Visible Headers with scrolling - GRIDVIEW
Dec 07, 2012 07:52 AM|LINK
Hi,
Just have a look in the following links, really helped me lot of times....
Nice example wtih online demo and downloadable code files.
http://mattberseth.com/blog/2007/09/freezing_gridview_column_heade.html
http://mattberseth.com/blog/2007/09/freezing_gridview_column_heade_1.html
Remember to click Mark as Answer on the post that helps to others.
My Blog :MyAspSnippets
sam233
Member
36 Points
218 Posts
Re: Visible Headers with scrolling - GRIDVIEW
Dec 07, 2012 10:46 AM|LINK
the links provided wont allow me to download nor try out the online version!!!!!
twlikol
Member
88 Points
20 Posts
Re: Visible Headers with scrolling - GRIDVIEW
Dec 07, 2012 03:24 PM|LINK
i wrote jQuery plug-in can do this! maybe you can try.

Supported Browsers
looking more in website: http://gridviewscroll.aspcity.idv.tw/
http://gridviewscroll.aspcity.idv.tw/
Golds
Member
42 Points
28 Posts
Re: Visible Headers with scrolling - GRIDVIEW
Dec 08, 2012 05:40 AM|LINK
Try This
<table border="1" id="dummyHeader" style="height:10px;overflow:auto;width:300px;"> <thead> <tr> <th scope="col" style="width:100px;">Customer ID</th> <th scope="col" style="width:100px;">City</th> <th scope="col" style="width:100px;">Contry</th> </tr> </thead> </table> <div id="container" style="height:200px;overflow:auto;width:315px;"> <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="CustomerID" DataSourceID="SqlDataSource1" CssClass="grid" HeaderStyle-CssClass="hdr"> <Columns> <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" InsertVisible="False" ReadOnly="True" SortExpression="CustomerID" ItemStyle-Width="100px" /> <asp:BoundField DataField="City" HeaderText="City" SortExpression="City" ItemStyle-Width="100px" /> <asp:BoundField DataField="Country" HeaderText="Country" SortExpression="Country" ItemStyle-Width="100px" /> </Columns> </asp:GridView> <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:masterConnectionString %>" SelectCommand="SELECT CustomerID, City, Country FROM Demo"></asp:SqlDataSource> </div>CSS
<style type = "text/css"> .hdr { display:none; }hans_v
All-Star
35986 Points
6550 Posts
Re: Visible Headers with scrolling - GRIDVIEW
Dec 08, 2012 08:36 AM|LINK
Try the CoolGridView:
http://ideasparks.codeplex.com/