¿Cómo congelar el encabezado GridView?

Question

Como en un título, ¿alguien sabe cómo congelar el encabezado GridView en ASP.NET?

Answer 1

Opción (a) comprar en un paquete de UI que incluye un GridView mejorado con esta funcionalidad incorporada.

Opción (b) rodar la suya propia: no es simple. Dino Esposito tiene un enfoque .

EDITAR: Acabo de notar que el artículo de Dino se vincula a un área solo para suscriptores en el sitio de la revista ASPnetPro.

Aquí está otro enfoque usando extensores.

Answer 2

Puedes hacerlo en el CSS

Congelar encabezado: 1. Defina la clase. Congelación en la hoja de estilo:

.Freezing
{
   position:relative ;
   top:expression(this.offsetParent.scrollTop);
   z-index: 10;
}   

2. Asignar cssClass del encabezado de cuadrícula de datos a congelación

Answer 3

Pruebe este proyecto de código abierto para ASP.NET. Extiende GridView para proporcionar encabezado fijo, pie de página y buscapersonas y ancho de columna redimensionable. Funciona bien en IE 6/7/8, Firefox 3.0 / 3.5, Chrome y Safari.

http://johnsobrepena.blogspot.com /2009/09/extending-aspnet-gridview-for-fixed.html

Answer 4

Yo también enfrenté un problema similar al desarrollar aplicaciones web en Asp.Net 2.0 / 3.5.

Un buen día, me encontré con IdeaSparks ASP.NET CoolControls . Ayuda a mostrar encabezados de columna de arreglo, pie de página y buscapersonas.

¡Los usé personalmente y realmente me encantó!

Para verificar el control, haga clic aquí: IdeaSparks ASP.NET CoolControls

¡Espero que esto ayude!

Answer 5

Creo que tengo una solución para esto. por favor vea el siguiente código de javascript

<script type="text/javascript" language="javascript">
    var orgTop = 0;
    $(document).scroll(function () {
        var id = $("tr:.header").get(0);
        var offset = $(id).offset();
        var elPosition = $(id).position();
        var elWidth = $(id).width();
        var elHeight = $(id).height();
        if (orgTop == 0) {
            orgTop = elPosition.top;
        }
        if ($(window).scrollTop() <= orgTop) {
            id.style.position = 'relative';
            id.style.top = 'auto';
            id.style.width = 'auto';
            id.style.height = 'auto';
        }
        else {
            id.style.position = 'absolute';
            id.style.top = $(window).scrollTop() + 'px';
            id.style.width = elWidth + 'px';
            id.style.height = elHeight + 'px';

        }
    });
</script>

donde .header es la clase css de su encabezado Grid.

Simplemente agregue este script en la página y reemplace header con el nombre de clase css que ha utilizado para su encabezado.

Answer 6

Pruébelo para resolver el problema http://www.codeproject.com/KB/webforms/FreezePaneDatagrid.aspx

Answer 7

Puede probar el siguiente ejemplo

Freeze GridView Columnas