Scrollable Grid

[tshad]

I was just looking at a site that had scrollable grids and was wondering how
that is done?

It was an aspx page, but I have only seen Datagrids that were
non-scrollable. You can page a grid but I have never seen an option to make
a grid scrollable.

Does anyone know how that is done?

Thanks,

Tom

 

[Mark Rae [MVP]]

I was just looking at a site that had scrollable grids and was wondering
how that is done?

It was an aspx page, but I have only seen Datagrids that were
non-scrollable. You can page a grid but I have never seen an option to
make a grid scrollable.

Does anyone know how that is done?

http://www.google.co.uk/search?sour...-GBGB220GB220&q="ASP.NET"+GridView+scrollable

 

[John Mott]

The primary trick is to put the gridview inside a DIV tag that has a height
and an overflow-y:scroll so that it creates a scroll bar, so the gridview
itself doens't do the scrolling. If you want to have the headers in a fixed
position above the scrolling gridview you copy the header row with
javascript. There is a good example here, i've done it before based on this
logic.

http://www.codeproject.com/useritems/ScrollingGridView.asp

john

 

[tshad]

The primary trick is to put the gridview inside a DIV tag that has a
height and an overflow-y:scroll so that it creates a scroll bar, so the
gridview itself doens't do the scrolling. If you want to have the headers
in a fixed position above the scrolling gridview you copy the header row
with javascript. There is a good example here, i've done it before based
on this logic.

http://www.codeproject.com/useritems/ScrollingGridView.asp

Div was the way to do it. I didn't realize it had an overflow attribute.
I also create a table with just one row to handle the header.

Here is the way I did it:

<table border=1 cellspacing="0" cellpadding="0" width="475px">
<tr class=jay style="background-color:#3ba4bd; color:FFFFFF;">
<td width="82px">Date Posted</td>
<td width="101px">Posted By</td>
<td width="234px">Note</td>
</tr>
</table>
<div style="height:100px; border-bottom:1px solid
#000000;width:475px;overflow: auto;">
<aspataGrid
Visible=true
....

This works really well.

Thanks,

Tom