jqGrid con DataProvider y una idea de pattern

Bueno amigos, aquí estamos con todas las cosas que han estado ocurriendo, todo lo de Smart Devices y ahora la Ev3 con lo de Responsive Web, que me ha dejado atento a lo que hará la gente de DVelop, K2BTools y PXTools con sus respectivos patterns.

En particular, relacionado con lo de jquery-bootstrap-etc, he estado pensando en otra forma de enfocar la generación de la interfaz web, con un nuevo pattern, que directamente generaría HTML y no webpanels GX. Algo parecido a esto seguramente ya lo ha practicado más de alguno: tener un sitio hecho "a mano" que se enganche de alguna forma a programas generados con GX, vía Ajax, por ejemplo.

Para empezar a dar forma más concreta a la idea del pattern, me puse a trabajar en el "canonical example", basándome en una plantilla bootstrap (Ace), tratando en primera instancia de levantar la misma plantilla y enlazar un jqGrid a un DataProvider con paginado.


Así quedó:

La gran tarea aquí es descomponer el diseño original y crear una serie de procedures que retornen el contenido según se requiera.Y a partir de eso ir dando forma al pattern que luego producirá automáticamente los objetos necesarios.


Paso a contarles algunos detalles del ejemplo y en particular de cómo lo hice con el jqGrid.

El programa principal es un procedure Main con Call Protocol HTTP que devolverá todo el html. Podría entenderse como una MasterPage con un navbar, un sidebar y un "ContentPlaceHolder".

El siguiente fragmento corresponde a un procedure que genera contenido de diferentes páginas según una variable "&pageId". En particular en este caso, se incluyen los tags necesarios para la carga del jqGrid en la página "wwproducto".

Luego, en otro procedure se incluyen los scripts. Aquí vemos parte del código que dibuja el grid y el pager en los tags mencionados antes, y el enlace al programa que retorna el json.

Lo más probable es que esto finalmente quede en procedures separados, a ser generados mezclando código de usuario y código automático a partir de la información de la instancia del pattern en los objetos en que se aplique.

A continuación la definición de la estructura a usar para la consulta de datos y carga del jqGrid. En el primer nivel van los parámetros requeridos por el pager, y en la colección los datos solicitados. El pattern debiera generar estas estructuras para cada transaction que se requiera.

El siguiente es el procedure (main, call protocol http) invocado por la jqGrid. Aquí tomamos los parámetros del request, propios de jqGrid (con un poco de csharp), hacemos la llamada al dataProvider y retornamos el json.

 Y finalmente el DataProvider que hace la magia.

Claramente esto es una aproximación al tema y quedan muchos asuntos por ver y resolver. Además de las cosas que pueden cambiar en el camino. Por decir algo: el template que escogí acaban de actualizarlo y esta vez viene con una versión full Ajax.

Se pone interesante.