How to make the frozen grid view header

[mvmashraf]

The simplest way i follows........ ...

step 1: place the grid view in a DIV tag...

ie: eg: <div id="divdatagrid " style="overflow : scroll; width: 750px; height: 265px">

Step 2 : on load event call the following java script

<script language="JavaS cript" type="text/javascript">
function FreezeGridHeade r()
{
var arRows = document.getEle mentById('ctl00 _WorkArea_gvRFP s').rows;
var oDiv = document.getEle mentById('divda tagrid');
arRows[0].style.position = "relative";
arRows[0].oParentDiv = oDiv;
arRows[0].style.setExpre ssion("posTop", "oParentDiv.scr ollTop-2");
arRows[0].style.zIndex = 30;

}
window.onload=F reezeGridHeader ;
</script>

Here "ctl00_WorkArea _gvRFPs" is the gridview name.
"divdatagri d" is the surrounding div name..

Thanks...
@shraf
S.E.... Cochin

[Plater]

What do you mean by frozen gridview headers? Mine never move already?

[Frinavale]

fought with this problem for a while and tried many things like setting the header's position="absol ute" etc...etc.

The way I solved this problem was to make a table above the GridView that was static and then placed the GridView into a <div> that allowed scrolling.

Eg:

[code=asp]
<asp:Panel runat="server" ID="Container" style="width:30 0px">
<table width="100%" border="0" cellspacing="0" >
<tr><td> <%=FirstColumnH eader%></td></tr>
<tr><td> <%=SecondColumn Header%></td></tr>
<tr><td> <%=ThirdColumnH eader%></td></tr>
</table>
<asp:Panel runat="server" ID="Scroll" style="height:1 00px; overflow:auto;" >
<asp:GridView ID="MyGridView " runat="Server>
<Columns>
<asp:BoundFie ld DataField="Firs tColumn></asp:BoundField>
<asp:BoundFie ld DataField="Seco ndColumn></asp:BoundField>
<asp:BoundFie ld DataField="Thir dColumn></asp:BoundField>
</Columns>
</asp:GridView>
</asp:Panel><!--Closing the Scrolling area-->
</asp:Panel><!--Closing the Containing area-->
[/code]

The asp code: "<%=FirstColumn Header%>" prints the value of a property named FirstColumnHead er that returns a string representing the First Column's Header.

Using a table for the header was a little hard to line up with the GridView (the lines were off by a couple of px) but this method avoided problems that occur with setting the GridView's Header to a position of absolute and then scrolling it to the correct position using JavaScript.

-Frinny

[Plater]

I still don't know what the situation you are trying to solve here is?
Are you trying to make the gridview header row "float" down when you scroll down?