El Blog del Leo

Compartiendo lo que aprendo

Cabecera fija en GridView con Scrollbar

Esta idea es autoría de mi amigo Oscar y me sugirió que la publicará en el blog. Nos vimos con la necesidad de en vez de paginar los gridview extender su tamaño usando scrollbars, al implementarlo nos pidieron que cuando bajasemos a través del scrollbar el header del GridView se mantuviese y alli comenzó la dificultad.

La forma tradicional de recrear la situación sin tener aun el Header del GridView estatico sería tal como sigue:

Colocamos un panel que contenga el gridview, establecemos un tamaño definido para el panel y asi aparecerá el scrollbar. Pero seguimos con el problema que nuestro header se sigue moviendo en conjunto con la grilla y no se mantiene fijo.


Y como hacemos que el Header del GridView se mantenga fija cuando bajamos a través del ScrollBar. La solución la tiene nuestro amigo CSS con una simple línea de codigo obtendremos el efecto deseado.

Agregamos esta linea a nuestro archivo css y los asociamos al panel en su propiedad CssClass.
<asp:Panel id="pnlGridView" CssClass="headerFlotante" ... /> y obtendremos nuestro resultado que es un Header fijo mientras movemos el Scrollbar.

 

Les adjunto el codigo si lo quieren revisar con más calma.

Espero que les sirva.
Saludos.

Seguidores

Certificaciones

Microsoft Certified Professional

Mis Tweets

Twitter