Me Myself & C#

Manoj Garg’s Tech Bytes – What I learned Today

Freezing a row in Asp.NET GridView

Posted by Manoj Garg on July 30, 2008

In ASP.NET Grid view we don’t have a scroll feature so that the content rows will scroll with mouse not the Header/Footer Rows. Recently in my project I got a requirement where I had to fix the Header and the Top Pager row of a grid view and keep the content of the gridview scrollable once the content height gets more then the container height.

After some hits & trials  and some googling, I got through.

Following is the style you need to use for making a row fix in the Grid.

/*below style is used for freezing grid header so that it doesn’t scrolls with grid rows*/
.GridHeaderFreezing

   position:relative; 
   top:expression(this.offsetParent.scrollTop);
   padding:0px;
   margin:0px;    
   z-index: 10;
}

and apply this CSS Class to the row you want to make static. for example:

<HeaderStyle CssClass=”GridHeaderFreezing“></HeaderStyle>

like wise you can apply this style to any of the Rows of a GridView.

PS: It works great with Internet Explorer but not on FF

Hope it helps 🙂

Advertisements

7 Responses to “Freezing a row in Asp.NET GridView”

  1. Indra said

    Very nice post… Thanks…
    You rocked!!!

  2. Nasha said

    Good info. Thanks for sharing.

  3. Matt said

    What is the “offsetParent”????

  4. WebGrid said

    Javascript alternative for Firefox/Chrome

    document.body.onresize = function() {
    rttopdiv = gettag();
    rttopdiv.left = this.offsetParent.scrollTop;
    rttopdiv.top = document.body.scrollTop;
    }

    It works fine for me.

  5. AJK said

    Thanks alot. It worked.

  6. Hardik said

    Nothing Works……Please help me.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: