Smartwig - Gestionar varias instancias del mismo crud en distintas pestañas

326 views
Skip to first unread message

apicito

unread,
Jan 30, 2013, 6:38:57 AM1/30/13
to symfo...@googlegroups.com
Mi escenario.
Una aplicación con unos tabs en los que se van abriendo aplicaciones CRUD generadas con:
php app/console generate:doctrine:richcrud
Es posible abrir varias instancias del mismo CRUD por lo que en el controlador cuando creo el grid le personalizo el Id para poder diferenciarlos:
$prgId = date("YmdHis");
$grid = new \YsGrid('grid'.$prgId,'Grid'.$prgId);

En la vista tengo los Remote_command para realizar las acciones del crud y necesito personalizar a que grid se refieren:
{% remote_command
update="#aplicacionWorkspace"
beforeSend=js_function("return SmarTwig.grid.hasSelectedRow('#grid'+{{prgId}},'Debes seleccionar un registro')")
type="GET"
url=arg(path("aplicacion_delete", { "id": $('#grid'+{{prgId}}).jqGrid('getGridParam','selarrrow')}) | raw_url_decode)
name="rcEditAplicacion"
%}

para ello utilizo el prgId pasado desde el controlador. He probado mil convinaciones y esta es la última.
En el lio de comillas simples y dobles, parentesis y corchetes no he conseguido la convinaicón adecuada.
Alguna sugerencia.
Un saludo.

oyepez003

unread,
Jan 30, 2013, 10:34:11 AM1/30/13
to symfo...@googlegroups.com
No entiendo cual es el problema realmente.

Cual es el error que te da?.

Saludos

apicito

unread,
Jan 30, 2013, 11:04:57 AM1/30/13
to symfo...@googlegroups.com
Con la versión que publiqué en el anterior post:
"NetworkError: 500 Internal Server Error - http://localhost/Symfony/Lx/web/app_dev.php/aplicacion/"
y no me muestra el grid.
Si elimina la linea breforeSend para que sea más fácil depurarlo y dejo la de url me pasa lo mismo.
Si le añado comillas dobles antes del $ y antes del cierre del corchete de parametros, osea:

url=arg(path("aplicacion_delete", { "id": "$('#grid'+{{prgId}}).jqGrid('getGridParam','selarrrow')"}) | raw_url_decode)
me da:
SyntaxError: illegal character
[Break On This Error]    
...mfony/Ltx/web/app_dev.php/aplicacion/$('#grid'+{{prgId}}).jqGrid('getGridParam',...

y me muestra el grid pero con la pantalla oscurecida en estado "modal" y con el "loading".
Y bueno, he ehcho muchas más pruebas, pero no he conseguido que funcione.
¿Habría forma de completar los parametros beforeSend y url llamando a un una función js que devuelva el paremetro?.
Un saludo.

oyepez003

unread,
Jan 30, 2013, 1:37:52 PM1/30/13
to symfo...@googlegroups.com
Si puedes adjuntar el archivo de la vista y el controlador para ayudarte un poco mas.

Saludos

Apicito Plici

unread,
Jan 30, 2013, 1:59:49 PM1/30/13
to symfo...@googlegroups.com
Están un poco emborronados por que lo que estoy buscando en un método de trabajo mas que un bundle real.
El script que está al final de la vista tambien son pruebas.
Saludos.


--
--
Has recibido este mensaje porque estás suscrito al grupo "symfony-es" de Google Groups.
Para publicar en este grupo, envía un email a symfo...@googlegroups.com
Para darte de baja, envía un email a symfony-es+...@googlegroups.com
El resto de opciones puedes encontrarlas en http://groups.google.com/group/symfony-es?hl=es
 
---
Has recibido este mensaje porque estás suscrito al grupo "symfony-es" de Grupos de Google.
Para anular la suscripción a este grupo y dejar de recibir sus correos electrónicos, envía un correo electrónico a symfony-es+...@googlegroups.com.
Para obtener más opciones, visita https://groups.google.com/groups/opt_out.
 
 

AplicacionController.php
index.html.twig

oyepez003

unread,
Jan 30, 2013, 3:24:32 PM1/30/13
to symfo...@googlegroups.com
Si te da un error 500 es por que esta devolviendo un Excepcion, en ese caso revisa el log para ver en que linea esta dando el error y que mensaje es... lo mas seguro es que sea un error de BD.

Saludos.

apicito

unread,
Jan 30, 2013, 5:12:15 PM1/30/13
to symfo...@googlegroups.com
Todo funciona correctamente hasta que cambio el Id del grid estático "#aplicacionGrid" que produce el generador de CRUD
generate:doctrine:richcrud
por el que creo dinámicamente con "grid"+{{prgId}} utilizando prgId que viene desde el controlador.
Y el error se produce cuando se genera la url dinámicamente en:

url=arg(path("aplicacion_delete", { "id": "$('#grid'+{{prgId}}).jqGrid('getGridParam','selarrrow')"}) | raw_url_decode)
da error:

SyntaxError: illegal character
[Break On This Error]    
...mfony/Ltx/web/app_dev.php/aplicacion/$('#grid'+{{prgId}}).jqGrid('getGridParam',...

la vista no consigue crear el parámetro url.
El problema es que después de probar todas las combinaciones que se me ocurren no he conseguido que funcione. Quizás porque no se puede utulizar esa creación dinámica.
Otra solución que se me ocurre, aunque no sé si es posible o como hacerlo, es llamar a una función javascript para que retorne la url ya formada.
Saludos.

oyepez003

unread,
Jan 30, 2013, 5:58:36 PM1/30/13
to symfo...@googlegroups.com
Este error es de javascript o te lo da el servidor?.

apicito

unread,
Jan 30, 2013, 6:34:16 PM1/30/13
to symfo...@googlegroups.com
No tengo claro si el remote_command de ST es Js. En todo caso, el mensaje me aparece en el console de firebug tal cual te lo muestro en el anterior mensaje. Mi impresión es que lo produce twig

oyepez003

unread,
Jan 30, 2013, 9:04:59 PM1/30/13
to symfo...@googlegroups.com
Hola creo que por aqui puede estar el error sobre lo que comentaste en tu primer post prueba asi:

  {% remote_command
    update="#aplicacionWorkspace"
    type="GET"
    url=arg(path("aplicacion_delete", { "id": "'$('#grid" ~ {{prgId}}
~ "').jqGrid('getGridParam','selrow')+'"}) | raw_url_decode)
    name="rcEditAplicacion"
  %}


A ver si asi sirve....

Te recomiendo uses algun editor de texto que te ayude a distinguir la sintaxis en las plantillas twig. yo por ejemplo uso
Netbeans con el plugin llamado "Twig for Netbeans", porque si lo haces en un editor de texto como notepad si puede
que te pierdas y te confundas en que es concatenacion javascript y que es concatenacion de Twig.

Saludos.

oyepez003

unread,
Jan 31, 2013, 12:55:29 AM1/31/13
to symfo...@googlegroups.com
Y sino asi:

{% remote_command
    update="#aplicacionWorkspace"
    type="GET"
    url=arg(path("aplicacion_delete", { "id": "' + $('#grid" ~ {{prgId}}
~ "').jqGrid('getGridParam','selrow') +'"}) | raw_url_decode)
    name="rcEditAplicacion"
  %}


;) Saludos.



El miércoles, 30 de enero de 2013 19:04:16 UTC-4:30, apicito escribió:

apicito

unread,
Jan 31, 2013, 10:41:41 AM1/31/13
to symfo...@googlegroups.com
Gracias por la aportación.
Utilizo como editor SublimeText2 con un plugin para twig y ya me marca sintaxis.
He probado las dos opciones y las dos me dan
"NetworkError: 500 Internal Server Error - http://localhost/Symfony/Ltx/web/app_dev.php/aplicacion/"
y no renderizan el grid
Si elimino la linea con el parametro "url" se renderiza correctamente y no da error de servidor, aunque, como es normal, no funciona el boton de edición de registro.
Creo que por alguna razón no permite generar ese parámetro de forma dinámica.
Voy a instalar el FosJsRoutingBundle y utilizar funiones js que realicen la apertura de la ventana del formulario.
Ya contaré por aqui como va esa solución.
Un saludo.

apicito

unread,
Feb 2, 2013, 4:58:27 AM2/2/13
to symfo...@googlegroups.com
Pongo como he solucionado el problema, aúnque sopongo que no de una forma muy brillante, por si alguien llega aquí buscando información.
Es necesario instalr el FOSJsRouting para disponer de las rutas en JavaScript.
Para imaginarse el escenario supongamos que se trata de un visualizador de expedientes, cada expdiente tine una serie de documentos.
Desde un menu se pueden ir abriendo pestañas que contienen un grid con los documentos de cada expediente. Incluso se puede abrir varias veces el mismo expediente.
He generodo un crud con el generador de smartwig y lo he modificado de la siguiente forma.
Un boton abre un menu donde están cargados los expedientes exitentes.
{% menu_item
          id="expediente"
          value=path("expediente_todos")  // El controlador index del CRUD
          label="PENDIENTES"
          onclick="addTab()" %}


El script que gestiona las pestañas.
{% block javascripts %}
  <script type="text/javascript">
    var indiceTab = 0;
    function addTab(){
      indiceTab++;
      var ruta = $(expediente).attr('value');   // LLama al controlador index del CRUD donde se genera el grid
      var etiqueta = $(expediente).text();   
      tabsPral.wijtabs('add', ruta, etiqueta, indiceTab);
      tabsPral.wijtabs('select', indiceTab);
    }
    $('#tabsPral span.ui-icon-close').live('click', function () {
      index = $('li', tabsPral).index($(this).parent());
      tabsPral.wijtabs('remove', index);
    });
  </script>
{% endblock %}


En el controlador se modifica la creación del grid:
Modificando su Id que nos va a permitir más tarde hacer selecciones sobre él:
        \YsJQuery::useComponent(\YsJQueryConstant::COMPONENT_JQGRID);

        $prgId = date("YmdHis");
        $grid = new \YsGrid('grid'.$prgId,'grid'.$prgId);
Añadiendo funciones controladores del las acciones del CRUD, ya que no utilizo las que crea el Generador:
        $grid->setOnDblClickRow( new \YsJsFunction("onDblClickRow(".$prgId.")"));
        $grid->setOnDblClickRow( new \YsJsFunction("reloadGrid(".$prgId.")"));


En la vista del index creo una barra de herramientas para las acciones
    <p>{% ui_button width="15" value="E" onclick="onDblClickRow" %}
    <p>{% ui_button width="15" value="R" onclick="reloadGrid()" %}


y elimino los remote command y creo las funciones manejadoras. Muestro el dobleClick
{% block javascripts %}
  <script type="text/javascript">
    function onDblClickRow(prgId){
      var grella = $('#grid'+prgId);
      var id = grella.jqGrid('getGridParam','selrow');
      if (id) {
        $.pnotify('Se va a editar el registro: '+id);
        $('#aplicacionWorkspace').load(
          Routing.generate('expdiente_edit', { prgId: prgId, id: id }) // El routing debe adaptarse a esto
        );
      } else {
        $.pnotify('Debe seleccionar un registro '+prgId);       
      }
    }
    function reloadGrid(prgId) {
      var grella = $('#grid'+prgId);
      jQuery('#grid'+prgId).jqGrid("clearGridData", true).trigger("reloadGrid");
    }
  </script>
{% endblock %}


En el controlador hago que en el editAction se reciba
    public function editAction($prgId, $id )
y se envie a la vista el id del grid para no perder su referencia y no confundirlo con otros que existan en otras pestañas:
            return array(
                'prgId'       => $prgId,
                'entity'      => $entity,
                'edit_form'   => $editForm->createView(),
            );


En la vista del edit despues de actualizar el registro intento que recarge el grid
  {% ajax_form id="frmEditAplicacion"
      update="#aplicacionWorkspace"
      action=path("aplicacion_update", { "prgId": prgId, "id": entity.id })
      method="PUT"
      complete=js_function("jqXHR","
        if (jqXHR.status == 200){
          $.pnotify('Actualizado con éxito');
          dlgEditAplicacion.wijdialog('destroy');
          reloadGrid();
        }")
  %}

la función de recarga
{% block javascripts %}
  <script type="text/javascript">
    function reloadGrid(){
        $('#grid{{ prgId }}').trigger('reloadGrid');     
    }
  </script>
{% endblock %} 


Con esto funciona adecuadamente la gestión de varias instancias del mismo crud en distintas pestañas.

Lo que aún no he conseguido es que me funione la recarga del grid. He buscado y mirado todo lo que he encontrado sobre JqGrid, pero ninguna de las soluciones parece funcionar.
He probado:
$('#grid{{ prgId }}').trigger('reloadGrid');
$("#mygrid").setGridParam(…).trigger("reloadGrid",[{page:1}]);
jQuery("#myGrid").jqGrid("clearGridData", false).trigger("reloadGrid");
$('.ui-jqgrid table', '#tab-ínfo').trigger('reloadGrid');

Y nada.
Seguiré buscando...
Saludos.

oyepez003

unread,
Feb 3, 2013, 8:29:42 PM2/3/13
to symfo...@googlegroups.com
Que bueno que te ha funcionado....

Es muy buena opcion usar FOSJsRouting para el manejo de URL's en el cliente (habia pensado colocarlo como dependencia pero preferi dejarlo de parte del programador que tome la decision).

Con respecto a que no has podido recargar el grid debe ser porque el id del datatable esta mal....

El metodo para recargar el grid es:

...
$('#elIdDelGrid').trigger('reloadGrid');
...

Saludos.

apicito

unread,
Feb 5, 2013, 1:28:57 PM2/5/13
to symfo...@googlegroups.com
Ya había probado esto pero no me funciona.
Tal y como yo lo entiendo cuando se hace:

$('#elIdDelGrid').trigger('reloadGrid');
se produce una llamada a la url que se configura en el controlador al crear el grid, es decir:
...
$grid->setUrl($this->generateUrl('aplicacion_data'));
...

y en esta acción del controlador se devuelve u json que se utiliza para recargar automáticamente el grid.
Sin embargo si creo un botón al lado del grid que sea:
<input
                    id="bR{{prgId}}"
                    class="ui-button ui-widget ui-state-default ui-corner-all"
                    type="button"
                    value="R"
                    onclick="reloadGrid( '{{prgId}}' )"
                    role="button"
                    aria-disabled="false">

y la función sea:
    function reloadGrid(prgId) {
      var gr = $('#grid'+prgId);
      gr.trigger("reloadGrid");
    }

No veo que haga ningún request al servidor.
¿Estoy entendiendo mal como funiona el reload?;
Saludos.

apicito

unread,
Feb 5, 2013, 1:40:13 PM2/5/13
to symfo...@googlegroups.com
Tambien he probado a llamar el reload directamente desde el botón:
           <input
                    id="bR{{prgId}}"
                    class="ui-button ui-widget ui-state-default ui-corner-all"
                    type="button"
                    value="R"
                    onclick=$("#grid{{prgId}}").trigger("reloadGrid")
                    role="button"
                    aria-disabled="false">

y esto genera este html pero no funiona:
    <input
      id="bR20130205193152"
      class="ui-button ui-widget ui-state-default ui-corner-all"
      type="button"
      aria-disabled="false"
      role="button"  
      onclick="$("#grid20130205193152").trigger("reloadGrid")"
      value="R">

Donde grid20130205193152 es el id del grid.

oyepez003

unread,
Feb 5, 2013, 6:34:16 PM2/5/13
to symfo...@googlegroups.com
Prueba colocando un Id al grid estatico y no dinamico a ver si asi funciona.

Saludos

apicito

unread,
Feb 6, 2013, 11:31:19 AM2/6/13
to symfo...@googlegroups.com
Con Id estática obtengo el mismo resultado. Si en la función reloadGrig() meto un alert para comprobar que se ejecuta
    function reloadGrid(prgId) {
      alert('Dentro de la función');
      $('#grid12').trigger("reloadGrid");
    }

me muestra el alert pero no hace ningún request.
Me puedes confirmar que el "reloadGrid" debería hacer un request a la url que definí en la creación del grid?.

$grid->setUrl($this->generateUrl('aplicacion_data'));
Gracias y saludos.

apicito

unread,
Feb 6, 2013, 12:11:00 PM2/6/13
to symfo...@googlegroups.com
Para comprobar que la llamada al servidor funiona he cambiado el contenido de la función por una llamada ajas directa:
        $.ajax( 
            { 
                type        : "get",                                             
                url         : Routing.generate('aplicacion_data'),                               
                data        : datos,                                                
                error       : alert('error en la llamada'),                               
                success     : console.log(datos)        
            });

y me devuelve un Json que creo que es correcto:
{"page": 1,"total": 13,"records": 13,"rows": [ {"id": 1,"cell": [ 1, "CONFIGURACION", "CFG", "CONFIGURACIONa"]}, {"id": 2,"cell": [ 2, "EXPEDIENTESFFFFFFF", "FFFFF", "EXPEDIENTES"]}, {"id": 3,"cell": [ 3, "EXPEDIENTES XXXX", "XXXX", "EXPEDIENTES"]}, {"id": 4,"cell": [ 4, "EXPEDIENTES DE", "APEaaaaa", "EXPEDIENTES"]}, {"id": 5,"cell": [ 5, "DDDDDDDDDD", "DDD", "DDDDDDDDDD"]}, {"id": 6,"cell": [ 6, "EXPEDIENTES DE PRUEBA", "PRU", "EXPEDIENTES"]}, {"id": 7,"cell": [ 7, "LISTADO LIST", "LIST", "LISTADO"]}, {"id": 8,"cell": [ 8, "EXPEDIENTES LLL", "LLLLLss", "EXPEDIENTES"]}, {"id": 9,"cell": [ 9, "RRRRRRRRRRRRRRR", "RRRdd", "RRRR"]}, {"id": 10,"cell": [ 10, "KKKKK", "kkkk--", "KKKKKKKKKKKKKKKKKKKKKK"]}, {"id": 11,"cell": [ 11, "sdasdasd", "asdas", "asdasdad"]}, {"id": 12,"cell": [ 12, 121212112, 12121, 121211212121212]}, {"id": 13,"cell": [ 13, "sssssssssssssssssss", "ssssssssss", "sssssssssssssss"]}]}
Message has been deleted

oyepez003

unread,
Feb 6, 2013, 6:10:15 PM2/6/13
to symfo...@googlegroups.com
Creo que ya se cual es el problema.

Para generar el Grid en el Generator extendimos de la clase YsJQGrid de jQuery4PHP y creamos la clase Yepsua\GeneratorBundle\UI\Grid esta clase en su constructor le concatena al id que le pasaste la palabra Grid, esto quiere decir que si tu Id es 'misDatos123456' en javascript debes colocar 'misDatos123456Grid'.

Asi que en tus pruebas coloca:

$('#grid12Grid').trigger("
reloadGrid");

Asi que solo debes concatenar la palabar Grid al final del ID.

Esto se realizo pensando en id's para grids de entidades como por ejemplo: userGrid, bookGrid, personaGrid, etc.

Saludos.


P.D. La clase
YsJQGrid de jQuery4PHP no tiene este comportamiento de la concatenacion del string 'Grid' al final.
 





apicito

unread,
Feb 14, 2013, 1:38:31 PM2/14/13
to symfo...@googlegroups.com
Perdona por el retraso, pero no he podido decirle tiempo a esto en los últimos días.
He probado lo que me sugieres y en algún sitio no funciona bien lo de los Id´s dinámicos. Lo he intentado directamente con JqGrid y si que lo he conseguido. Pero solo he podido hacer una prueba básica, voy a seguir trabajando en ello y pondré aquí el resultado cuando lo tenga completo.

mario castrelo

unread,
Feb 18, 2013, 12:37:17 PM2/18/13
to symfo...@googlegroups.com
Para futuras consultas sobre este tema adjunto un bundle donde desde un menu se pueden ir creando tabs con instancias del mismo programa y que funcionan de forma independiente. No es un programa utilizable ni me he fijado en la presentación, solo es un prototipo del funcionamiento que yo buscaba.
Gracias a oyepez003 por su ayuda. He tenido que sustituir el grid de Smartwig por el original jdGrid, ya que no he conseguido hacerlo funcionar correctamente con las ids dinámicas necesarias para construir objetos independientes.
Soy novato y seguro que existe una forma mejor de hacerlo, pero hasta ahí he llegado.
Un saludo.
OvBundle.rar

Marcelo Prizmic

unread,
Feb 18, 2013, 1:12:20 PM2/18/13
to symfo...@googlegroups.com
hola
perdón que me meta pero alguno podría mandar un ejemplo de un CRUD con smattwig?
gracias de antemano
marcelo

--

mario castrelo

unread,
Feb 18, 2013, 2:25:49 PM2/18/13
to symfo...@googlegroups.com
En este hilo:
https://groups.google.com/forum/?fromgroups=#!topicsearchin/symfony-es/smartwig/symfony-es/JeQcKnNJpg4
Explica como utilizar el generador automático de CRUD's de smartwig:
oyepez003 decía entonces:
Recuerdo que hace algun tiempo intentaste hacer un CRUD con SmarTwig y se habia hecho algo complejo asi que Aprovecho para decirte que he terminado un bundle para realizar CRUD basado en SesionGeneratorBundle.
El bundle es https://github.com/oyepez003/YepsuaGeneratorBundle
Asi que si instalas el bundle, con solo ejecutar el siguiente comando en la consola de Symfony se creara el codigo CRUD para el modelo definido:
php app/console generate:doctrine:richcrud
El codigo sera generado con etiquetas de SmarTwig y con jQgrid (YsGrid), RemoteCommands (Ajax Request), Notificaciones (pnotify) entre otras funcionalidades.
La idea de este bundle es ayudar a entender como se maneja SmarTwig de forma practica.

Saludos cordiales.

oyepez003

unread,
Feb 19, 2013, 10:52:22 AM2/19/13
to symfo...@googlegroups.com
Hola @Apicito2003, Gracias a ti por colaborar y ayudarnos a ver muchas cosas que andaban mal con el Bundle y tambien por compartir tu solucion.

Ayer realizamos una actualizacion a YepsuaSmarTwigBundle y al YepsuaGeneratorBundle que corrigen algunos bugs que hemos encontrado al hacer uso de los bundles.

Asi que el que quiera probar el Generator o SmarTwig y tiene alguna duda por aqui estaremos.

Saludos.

Apicito2003

unread,
Feb 20, 2013, 3:51:36 AM2/20/13
to symfo...@googlegroups.com
Gracias.
Reply all
Reply to author
Forward
0 new messages