¿Como Actualizar un GridView con Enlace a Datos en Tiempo de Ejecución?

Ayer martes por la mañana, uno de mis amigos me pidió ayuda con la grilla para web de Visual Studio 2005 (GridView), me dijo que no puede realizar actualizaciones de datos haciendo el enlace en tiempo de ejecución, es decir hacer todo por código, sin utilizar los componentes en tiempo de diseño con lo que se puede hacer la actualización de datos en pocos minutos.

Le dije (que no sabes hacer una cosa tan básica) no hay problema, en 20 minutos te mando un ejemplo completo; antes había trabajado de esta manera con el Framework 1.1 y el componente DataGrid sin ningún problema, pero grande fue mi sorpresa al ver que con el GridView las cosas se complicaban enormemente y algo que parecía tan básico no lo era tanto al menos para mi, luego de revisar muchas páginas con ejemplos, casi reventar el monitor con la cabeza y 3 horas de trabajo, al fin logré hacer andar el bendito ejemplo, a continuación algunas pautas para no enloquecer en el intento:

1. No te olvides que estas trabajando en un ambiente Web.- Debo confesarlo esto ya me había pasado antes, Visual Studio te da tantas facilidades para diseñar tus formularios de manera visual, que uno pierde la noción que esta desarrollando una aplicación web, y el error que me estaba volviendo loco esta relacionado simple y llanamente con el código que puse en el evento Load del formulario; como todos saben, el evento Load se dispara cada vez que la pagina se carga, incluido los PostBack necesario para realizar cada acción (por ejemplo pulsar un botón), para resolver el problema simplemente usamos la propiedad IsPostBack de la clase Page, que nos indica si es la primera ves que se carga la pagina o no:

if (Page.IsPostBack)
{
      //Se ejecuta todas las veces que se carga la pagina exepto la
      //primera vez
}
else
{
      // Se ejecuta solo la primera vez que se carga la pagina
{

2. Convertir las columnas en Plantillas.- Para facilitar el trabajo de recuperar los datos del registro que se esta editando, es necesario cambiar los tipos de columnas de BoundField a TemplateField, de esta manera podremos recuperar los datos que se están ingresando en cada uno de controles de la plantilla, utilizando el método FindControl.

3. Implementar los eventos del GridView que necesitemos.- Esta parte es muy importante, puesto que en estos eventos tendremos que poner toda la lógica para realizar la actualización de datos, los eventos más importantes que tenemos que interceptar son: RowEditing, RowUpdating, RowCancelingEdit y RowDeleting.

//método auxiliar para facilitar el trabajo de enlace a datos
void EnlazarDatos()
{
      //sdsEmpelado es un ObjectDataSource previamente configurado
      GridView1.DataSource = sdsEmpleados;
      GridView1.DataBind();
}

void GridView1_RowEditing(object sender, GridViewEditEventArgs e)
{
      //estableciendo la propiedad EditIndex hacemos que esa fila se
      //ponga en edición
      GridView1.EditIndex = e.NewEditIndex;
      EnlazarDatos();
}

void GridView1_RowUpdating(object sender, GridViewUpdateEventArgs e)
{
      //recuperamos la fila que estamos editando
      GridViewRow fila = GridView1.Rows[e.RowIndex];
      //inicializamos los parametros para actualizar
      sdsEmpleados.UpdateParameters["EmployeeID"].DefaultValue =
            (fila.FindControl(“Label1″) as Label).Text;
      sdsEmpleados.UpdateParameters["LastName"].DefaultValue =
            (fila.FindControl(“TextBox2″) as TextBox).Text;
      sdsEmpleados.UpdateParameters["FirstName"].DefaultValue =
            (fila.FindControl(“TextBox3″) as TextBox).Text;
      //Ejecutamos la actualización
      sdsEmpleados.Update();
      //para salir del estado de edición
      GridView1.EditIndex = -1;
      EnlazarDatos();
}

void GridView1_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)
{
      //para salir del estado de edición
      GridView1.EditIndex = -1;
      EnlazarDatos();
}

void GridView1_RowDeleting(object sender, GridViewDeleteEventArgs e)
{
      //recuperamos la fila que queremos eliminar
      GridViewRow fila = GridView1.Rows[e.RowIndex];
      //Inicializamos los parametros para eliminar
      sdsEmpleados.DeleteParameters["EmployeeID"].DefaultValue =
            (fila.FindControl(“Label1″) as Label).Text;
      //Ejecutamos la eliminación
      sdsEmpleados.Delete();
      //para que se actualice el grid
      EnlazarDatos();
}

Atención, el código que se muestra es solo un ejemplo, por simplicidad está sin las validaciones necesarias (por ejemplo comprobar que no sean nulos algunos objetos).

Si necesitan revisar un ejemplo totalmente funcional pueden descargar el ejemplo que hice para mi amigo, funciona con la base de datos Northwind con los tres primeros campos de la tabla Employees, utiliza la clase SqlDataSource, también se puede hacer con la clase SqlDataAdapter, pero como estamos trabajando con el .Net Framework 2.0, decidí utilizar la nueva clase SqlDataSource, espero que les sirva de algo.

Descargar Ejemplo: Ejemplo Actualización GridView
Favor de darle clic derecho y guardar destino como…, una vez descargado cambiar la extensión a .zip, y descomprimirlo (todo esto porque no me dejan subir archivos zip).

18 comentarios hasta ahora

  1. CHRISTIAN RUIZ on

    jaja con solo saber que yo fui el amigo que le dijo esa pregunta, jajaja bueno DOC gracias por la ayuda, me salvaste el dia, Muchas Gracias.

  2. Marlene Velozo on

    Eloy Paredes Quispe:

    Gracias por la ayuda funcioan todo en perfectas condiciones

  3. luis on

    Te felicito por el gran aporte que nos das.

  4. rene morales on

    Si me sirvio bastante la ayuda. Mi pequeño percance es que pues la manipulación de controles en Vb es diferente y pues no he podido darle solución a este trabajo gracias

  5. El AleX on

    Me estaba volviendo loco, Gracias

  6. Xochilt on

    Disculpen mi ignorancia, descargue el ejemplo y me bajo un archivo de Word.doc y al quererlo habrir no pude, podrian ayudarme.

    Gracias de antemano

  7. Karla Páez on

    Excelente artículo, modifique algunos métodos de acuerdo a mis necesides y funciona perfectamente, muchasss gracias :D …yo también empezaba a volverme loquita..jajaja

    Para el amigo que dejó este mensaje:
    ————————————————–
    Disculpen mi ignorancia, descargue el ejemplo y me bajo un archivo de Word.doc y al quererlo habrir no pude, podrian ayudarme.

    Gracias de antemano
    —————————————————
    Unicamente tienes que cambiar .doc a .zip y listo tendrá el archivo comprimido del ejemplo ;)

  8. Pacey Master on

    me sirvio, vale por el dato.

    con la ayuda que me haz dado pude seleccionar una tupla del gridview y mostrarla en un detailsview para poder updatear la tupla y así realizar los cambios en la tabla correspondiente y en su consulta sql la cual se muestra en mi gridview.

    “Se aquello para lo que haz nacido”

  9. Frank on

    Al igual que muchos, excelente articulo, o estoy haciendo todo “a pie” incluso sin el uso de los eevntos del gridview y tu arituculo me soluciono mi problema.

    Aclaro, sigo con todo a pie :-)

  10. Fabián H. on

    Excelente, didáctico y profesional.
    Me has ayudado mucho.
    Que Dios te bendiga.

    Fabián.

  11. Fabián H. on

    Eloy,
    he implementado tu ejemplo y anda muy bien, excepto por un problema que tengo con la paginación.
    Utilizando sqlDataSource supongo que con el DataSourceMode en DataSet como valor predeterminado debería funcionar dado que soporta ICollections.
    pero no me pasa a la pagina 2.
    Alguna pista que me puedas dar?
    desde ya muchas Gracias.

    Fabián. H.

  12. Juan Antonio on

    Agradezco de antemano que hallas puesto un ejemplo tan claro para resolver mis dudas.
    Saludos.

  13. Juan Carlos on

    Muy bien te felicito, pero aun falta algo mas complejo, en lo cual si estoy batallando lo cual es lo siguiente.

    -Crear las conexiones en tiempo de ejecucion
    -Crear los grids en tiempo de ejecucion
    -Crear los eventos de los grids
    -Añadirle datos
    -Y lo mas importante poder modificarlos(editar, actualizar).

    ya logre hacer los primeros 4 pasos y me permite editar pero me trae problemas al momento de actualizar por culpa de Databind() del grid. Si lo llegaras a resolver te lo agradeceria. y si pudieras mandarme tu respuesta.

    Ahora si que todo es a pata… jejjee… nos vemos

  14. sharysce on

    hola: y si necesito insertar filas sin la utilizacion del dataset, como se podria hacer eso??

  15. sharysce on

    mmmmm!!!

  16. Manter on

    Gracias por tu ejemplo, pero sabes soy nuevo en esto y me marca un error a la hora de correr la aplicacion, si pudieras o alguien que ya lo corrio pudiera ayudar, el error que me marca es el siguiente:

    Línea 19: ASP.NET to identify an incoming user.
    Línea 20: –>
    Línea 21:
    Línea 22: <!–
    Línea 23: The section enables configuration

  17. Michbo on

    hola man pero como hacer:

    sdsEmpelado es un ObjectDataSource previamente configurado

  18. Lenin on

    Hola,
    Felicidades por el ejemplo, una consulta, sin querer abusar. Tengo la curiosidad o mas bien la necesidad de tener un gridview, con varias columnas, cada columna con un templatefiel para un textbox, lo que quiero hacer es que si en la columna Codigo ingreso un código de producto, el programa vaya a la base de datos y traiga la descripción, precio y colocarlos en las columnas siguientes.

    He intentado de varias formas, pero no logro hacer que suceda esto.

    Quedo muy agradecido

    Lenin


Replica