none
Hacer postback, con jqGrid para hacer cambios a base de datos!! RRS feed

  • Pregunta

  • Hola!!

    Tengo un Grid implementado con jqGrid , que esta buenísimo, pero lo que pasa es que no he podido lograr que al hacer un cambio en los datos del Grid, se refleje en la base de datos. Aclaro que en el Grid si se reflejan los cambios...

    Gracias!!

    martes, 26 de octubre de 2010 4:31

Respuestas

  • Hola, Donoban.

    Hombreeeeee.... postback lo que se dice postback no es... jqGrid envía las actualizaciones, altas y eliminaciones de filas al servidor mediante llamadas Ajax a acciones del controlador. El procedimiento para todas estas operaciones es similar (en este post puedes encontrar una explicación detallada de cómo implementar la eliminación), aunque obviamente cada una tiene sus particularidades.

    En el caso de la modificación, para hacer que los cambios se reflejen en tu base de datos, en primer lugar, necesitas especificar en las opciones de edición del grid la URL de la acción que recibirá los datos vía Ajax. Esto puedes conseguirlo, por ejemplo así:

    $("#grid").navGrid(
      "#pager",
      { refresh: true, add: true, edit: true, del: true, search: false },
      editOptions,  // parámetros para la modificación
      addOptions,   // parámetros para el alta
      deleteOptions  // parámetros para la eliminación
    );
    

    (Lo he tomado de un código mío literalmente, es posible que tengas que adaptarlo a tu escenario. Por ejemplo, en este caso el grid está utilizando un Pager con id="pager").

    Las opciones de edición, la variable editOptions, tendría que estar definida previamente, por ejemplo:

    var editOptions = {
      url: '<%= Url.Action("Modificar") %>',
      width: 500,
      closeOnEscape: true,
      height: "auto"
    };
    

    Y ya en el servidor, el código de la acción "Modificar" podría ser como el siguiente. Ojo, que para que el binder pueda materializar el objeto (de tipo Usuario, en este caso), el nombre de las columnas (definidas en la propiedad ColModel del grid) debe coincidir con el de las propiedades de la entidad.

    [HttpPost]
    public ActionResult Modificar(Usuario usuario)
    {
    
    if (ModelState.IsValid) // Si los datos recibidos son correctos { // Modificamos el registro en la BDD
    // utilizando las clases del Modelo
    }
    else // Procesar el error

    {
    } }

    El retorno de este método podría ser un objeto JSON con el resultado de la operación, o simplemente un texto, que podrías recuperar en el callback afterSumit de las opciones de edición:

    var editOptions = {
      ... // todo igual que antes
      afterSubmit: function(request) {
       alert(request.responseText);
      }
    }

    Espero que te sea de ayuda.

    Saludos.

     


    José M. Aguilar
    Variable not found
    • Propuesto como respuesta eduard tomàsMVP viernes, 12 de noviembre de 2010 13:06
    • Marcado como respuesta Eder Costa jueves, 4 de octubre de 2012 15:00
    martes, 26 de octubre de 2010 7:53

Todas las respuestas

  • Hola, Donoban.

    Hombreeeeee.... postback lo que se dice postback no es... jqGrid envía las actualizaciones, altas y eliminaciones de filas al servidor mediante llamadas Ajax a acciones del controlador. El procedimiento para todas estas operaciones es similar (en este post puedes encontrar una explicación detallada de cómo implementar la eliminación), aunque obviamente cada una tiene sus particularidades.

    En el caso de la modificación, para hacer que los cambios se reflejen en tu base de datos, en primer lugar, necesitas especificar en las opciones de edición del grid la URL de la acción que recibirá los datos vía Ajax. Esto puedes conseguirlo, por ejemplo así:

    $("#grid").navGrid(
      "#pager",
      { refresh: true, add: true, edit: true, del: true, search: false },
      editOptions,  // parámetros para la modificación
      addOptions,   // parámetros para el alta
      deleteOptions  // parámetros para la eliminación
    );
    

    (Lo he tomado de un código mío literalmente, es posible que tengas que adaptarlo a tu escenario. Por ejemplo, en este caso el grid está utilizando un Pager con id="pager").

    Las opciones de edición, la variable editOptions, tendría que estar definida previamente, por ejemplo:

    var editOptions = {
      url: '<%= Url.Action("Modificar") %>',
      width: 500,
      closeOnEscape: true,
      height: "auto"
    };
    

    Y ya en el servidor, el código de la acción "Modificar" podría ser como el siguiente. Ojo, que para que el binder pueda materializar el objeto (de tipo Usuario, en este caso), el nombre de las columnas (definidas en la propiedad ColModel del grid) debe coincidir con el de las propiedades de la entidad.

    [HttpPost]
    public ActionResult Modificar(Usuario usuario)
    {
    
    if (ModelState.IsValid) // Si los datos recibidos son correctos { // Modificamos el registro en la BDD
    // utilizando las clases del Modelo
    }
    else // Procesar el error

    {
    } }

    El retorno de este método podría ser un objeto JSON con el resultado de la operación, o simplemente un texto, que podrías recuperar en el callback afterSumit de las opciones de edición:

    var editOptions = {
      ... // todo igual que antes
      afterSubmit: function(request) {
       alert(request.responseText);
      }
    }

    Espero que te sea de ayuda.

    Saludos.

     


    José M. Aguilar
    Variable not found
    • Propuesto como respuesta eduard tomàsMVP viernes, 12 de noviembre de 2010 13:06
    • Marcado como respuesta Eder Costa jueves, 4 de octubre de 2012 15:00
    martes, 26 de octubre de 2010 7:53
  • Hola, Donoban.

    Hombreeeeee.... postback lo que se dice postback no es... jqGrid envía las actualizaciones, altas y eliminaciones de filas al servidor mediante llamadas Ajax a acciones del controlador. El procedimiento para todas estas operaciones es similar (en este post puedes encontrar una explicación detallada de cómo implementar la eliminación), aunque obviamente cada una tiene sus particularidades.

    En el caso de la modificación, para hacer que los cambios se reflejen en tu base de datos, en primer lugar, necesitas especificar en las opciones de edición del grid la URL de la acción que recibirá los datos vía Ajax. Esto puedes conseguirlo, por ejemplo así:

    $("#grid").navGrid(
      "#pager",
      { refresh: true, add: true, edit: true, del: true, search: false },
      editOptions,  // parámetros para la modificación
      addOptions,   // parámetros para el alta
      deleteOptions  // parámetros para la eliminación
    );
    

    (Lo he tomado de un código mío literalmente, es posible que tengas que adaptarlo a tu escenario. Por ejemplo, en este caso el grid está utilizando un Pager con id="pager").

    Las opciones de edición, la variable editOptions, tendría que estar definida previamente, por ejemplo:

    var editOptions = {
      url: '<%= Url.Action("Modificar") %>',
      width: 500,
      closeOnEscape: true,
      height: "auto"
    };
    

    Y ya en el servidor, el código de la acción "Modificar" podría ser como el siguiente. Ojo, que para que el binder pueda materializar el objeto (de tipo Usuario, en este caso), el nombre de las columnas (definidas en la propiedad ColModel del grid) debe coincidir con el de las propiedades de la entidad.

    [HttpPost]
    public ActionResult Modificar(Usuario usuario)
    {
    
    if (ModelState.IsValid) // Si los datos recibidos son correctos { // Modificamos el registro en la BDD
    // utilizando las clases del Modelo
    }
    else // Procesar el error

    {
    } }

    El retorno de este método podría ser un objeto JSON con el resultado de la operación, o simplemente un texto, que podrías recuperar en el callback afterSumit de las opciones de edición:

    var editOptions = {
      ... // todo igual que antes
      afterSubmit: function(request) {
       alert(request.responseText);
      }
    }

    Espero que te sea de ayuda.

    Saludos.

     


    José M. Aguilar
    Variable not found

    Hola, porfavor quisiera que alguien me ayudara llevo ya variaos días tratando de hacer esto  y no me funciona cuando el objeto llega al controlador llega como null en que parte tengo que enviar el objeto la fila que el usuario modifico para que pueda guardar los cambios en la base de datos mi codigo el siguiente.

    onSelectRow: function (id) { if (id && id !== lastSel) { jQuery('#DataGrid').restoreRow(lastSel); lastSel = id; } alert(id); jQuery('#DataGrid').editRow(id,{ keys:true, url: '@Url.Action("EstoEsUnaPrueba","IngresoNotas")', } });

        public ActionResult EstoEsUnaPrueba(object obj)
        {
            string prueba = obj.ToString();
            return Json(true);
        }

    He intentado obtener varios tipos de objetos en el controlador como Json o Object pero siempre llega null

    como podría enviarle la fila modificada, valga la redundancia la fiala modificada, espero puedan ayudarme

    de antemano muchas gracias.


    Jurgen Ramirez


    • Editado HackRock viernes, 31 de enero de 2014 14:07
    viernes, 31 de enero de 2014 14:06