Alguien ha usado jQGrid

Publicado en 'Programación' por eduar2083, 24 Ago 2013.





  1. eduar2083

    eduar2083 Miembro frecuente

    Registro:
    26 Jul 2011
    Mensajes:
    224
    Likes:
    46




    Buenas señores. Estoy realizando unos mantenimientos en ASP.Net pero sin utilizar controles de servidor sino sólo HTML y jQuery. Las llamadas al servidor, es decir al código C#, las hago de manera asíncrona a través de $.ajax para guardar u obtener información desde la BD a través de servicios asmx. Para el listado de datos en grilla, estoy utilizando un plugin de jQuery llamado jQGrid el cual va de maravilla e incluso tiene configuraciones para realizar Insert, Update y Delete. El gran problema que me surge es que no he conseguido realizar paginación, es decir, que los registros se visualicen en varias páginas y poder navegar a través de ellas. He investigado bastante y no he logrado dar con la solución. Si alguien ha trabajado con este control de manera satisfactoria y podría echarme un cable estaré agradecido, o talvés conocen alguna otra grilla similar que trabaje con JSon o XML estaré agradecido.

    Saludos.
     


  2. Fumador

    Fumador Miembro frecuente

    Registro:
    22 Jun 2009
    Mensajes:
    162
    Likes:
    10
    Hola, yo también uso mucho esa librería... es lo que le falta al kendo-ui para ser perfecto.

    Ahora, hay 2 maneras de generar la grilla y paginación.

    * Una con el apoyo del lado del servidor donde éste tiene que saber gestionar la paginación y el ordenamiento de la data (columnas).

    * Y la otra donde se carga toda la consulta del server y el cliente gestiona el funcionamiento total de la grilla (loadonce).

    Supongo que si tienes problema con la paginación es porque estás usando la manera tradicional, eso ya es un tema de cómo estás generando internamente la cuenta de páginas en tu script de c#.

    Si lo cargas via loadonce simplemente pasas el resultado de tu consulta en formato json y el plugin se encarga de todo e inclusive de la paginación y el sorter.

    Te dejo un ejemplo básico en PHP (ya me olvidé de la mayoría de c#) de la forma tradicional usando una formula estándar de paginación:

    vista:
    PHP:
    $('#grilla').jqGrid({
            url:             '<?php echo proyecto/listar ?>',
            datatype:    "json",
            height:        "auto",
            mtype:        "GET",
    ...
    });
    el parámetro del plugin "url" te manda 4 datos: page, rows, sidx y sord, que obviamente debemos recibir y saber gestionar.

    controlador:
    PHP:
    function listar()
    {
     
    $page  $_GET['page'];
     
    $limit $_GET['rows'];
     
    $sidx  $_GET['sidx'];
     
    $sord  $_GET['sord'];
     
    $count 0;

    # formula para gestionar la paginacion
    if(!$sidx$sidx=1;      
    $count $total_pages ceil($count/$limit) : $total_pages 0;
    if (
    $page $total_pages$page $total_pages;
    $start $limit*$page $limit;
    if(
    $start <0$start 0;
        
    # ya tenemos el registro de inicio, la pagina y el total de pagina: $start, $page, $total_pages

    # obtenemos la data del modelo (con el order by como parametro)
    $data $this->modelo->listar($sidx$sord);

    # una vez obtenido la data la distribuimos en 2 datos que también necesita el plugin: 'id' y 'cell'
    $i=0;    
    foreach(
    $data as $line)
    {
     
    $rows[$i]['id']   = $line->iId;
     
    $rows[$i]['cell'] = array($line->iId$line->Column1$line->Column2);
     
    $i++;
    }

    # retornamos la respuesta de la data y la paginacion al plugin en formato json
    if(!isset($rows)) $rows 0;
    $responce = new stdClass();
    $responce->page $page;
    $responce->total $total_pages;
    $responce->records $count;
    $responce->rows $rows;
                
    return 
    json_encode($responce);

    }
    Creo que con éste simple ejemplo puedes acoplarlo al lenguaje usado y hacer una pequeña prueba. Suerte!
     
    Última edición: 27 Ago 2013
  3. eduar2083

    eduar2083 Miembro frecuente

    Registro:
    26 Jul 2011
    Mensajes:
    224
    Likes:
    46
    Hola Fumador, gracias por responder.
    Creo que la manera que estuve intentando hacerlo es por la primera: Enviaba los parámetros que mencionas al código de servidor y este los enviaba a un procedure de SQL Server para que esté devuelva una lista de registros. El gran problema que tenía es que por más que la grilla tenía 2, 3 o mil registros, nunca se visualizaban las flechas navegación de página. Mencionaste el atributo de configuración loadonce y lo tenía en true, al ponerlo en false solucionó mi problema.
    Aprovechando que trabajas con este control, me gustaría saber si utilizas su configuración para insertar, actualizar y eliminar. Yo lo estoy utilizando, se visualizan unos popups predefinidos y que ya vienen con estilos por defecto. Hasta ahora anda todo bien, aunque a decir verdad mi javascript ya tiene un tamaño relativamente grande, pero me gusta la idea de hacer las llamadas de manera asíncrona sin que la página parpadee. En resumen mi pregunta es si utilizas los popups de jQGrid para insertar/editar los datos o sólo utilizas las grilla y creas popups personalizados para editar la data.

    Saludos cordiales.
     
  4. Fumador

    Fumador Miembro frecuente

    Registro:
    22 Jun 2009
    Mensajes:
    162
    Likes:
    10
    hola, que bueno que solucionaste tu problema, he usado pocas veces el formulario ya que suelo mostrar datos básicos en las grillas y el mantenimiento suele ser de muchos más campos, por lo que uso formularios normales.

    Aunque dejame decirte que esa librería es muy potente, no sólo puedes editar los campos que tengan el parametro edit:true (y darles formato), sino que puedes agregar más controles sin necesidad que estén invocadas en la cabecera, tiene su propio control de validación, puedes cargar data externa por cada control (en el caso de los combobox) y eventos pre y post submit, es increiblemente completo.

    Que yo sepa el crud de esa librería es siempre asíncronia. Te recomiendo que leas los post de Oleg en stackoverflow, da muchas soluciones para el uso de jqgrid-php y jqgrid-asp.net, practicamente encuentras la biblia de esa librería.

    Suerte!
     
    Última edición: 31 Ago 2013
    A eduar2083 le gustó este mensaje.
  5. eduar2083

    eduar2083 Miembro frecuente

    Registro:
    26 Jul 2011
    Mensajes:
    224
    Likes:
    46
    Sí, efectivamente, he terminado unos cuantos mantenimientos con esta librería y es increíble. No tengo nada de código tras el aspx, sólo javascript y el código C# para traer o enviar data, lo hago a través de servicios invocados vía ajax.

    Bueno, hasta el momento, va todo bien, espero no tener dificultades cuando me tope con formularios más grandes.

    Saludos.