example - gridview asp.net c# sql server

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

La opción (a) permite comprar un paquete de UI que incluye un GridView mejorado con esta funcionalidad incorporada.

La opción (b) hace su propia versión, no es simple. Dino Esposito tiene un enfoque .

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

Aquí hay otro enfoque que usa extensores.

Answer 2

Puedes hacerlo en el css

Congelar encabezado: 1. Definir clase. Congelar en la hoja de estilo:

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

2. Asignar cssClass del encabezado Datagrid a Freezing

Answer 3

Haga una prueba para resolver el problema http://www.codeproject.com/KB/webforms/FreezePaneDatagrid.aspx

Answer 4

Pruebe este proyecto de código abierto para ASP.NET. Extiende GridView para proporcionar un encabezado fijo, pie de página y buscapersonas y un ancho de columna ajustable. 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 5

Puede probar la siguiente muestra

Columnas Freeze GridView

Answer 6

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 los encabezados de las columnas fijas, el pie de página y el buscapersonas.

¡Los usé personalmente y realmente me encantó!

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

¡Espero que esto ayude!

Answer 7

Creo que tengo una solución de esto. por favor vea el siguiente código 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 tu encabezado de Grid.

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