domingo, 3 de enero de 2010

[GridView] Javascript botón de eliminar con confirmación

 

El objetivo de este articulo es demostrar como hacer uso de la funcionalidad de javascript para pedir la confirmación del usuario ante la eliminación de un registro en el control GridView.

Como se observara en la definición del GridView, la sección importante es la siguiente:

 

                <asp:TemplateField ShowHeader="False">
                    <ItemTemplate>
                        <asp:ImageButton ID="ImageButton1" runat="server" CausesValidation="False" 
                            CommandName="Delete" ImageUrl="~/image/delete.png" Text="Delete" OnClientClick="return confirm('Esta seguro que desea eliminar el registro?');" />
                    </ItemTemplate>
                </asp:TemplateField>

 

El truco esta en definir el atributo OnClientClick

 

[C#]
[VB.NET]

24 comentarios:

  1. Hola que tal mi nombre es manu y soy de jujuy queria comunicarte que esta muy bueno tu blog y actualmente estoy leyendo todos tus articulos.
    Soy programador .net pero estoy recien empezando y quiero avanzar mucho mas
    Actualmente estoy aprendiendo nhibernate pero no se como poder incorporarlo a mi proyecto de windows forms. Si realizaste algun proyecto podrias comunicarlo
    muchas gracias

    ResponderEliminar
  2. hola

    que bueno que sean de utiles los articulos, me alegro

    Has revisado un post que realice en el año 2008, es el unico de ese año, alli explico como usar NHibernate.

    No esta armado hasta la interfaz grafica sino que se queda en los test, pero puede ser util como guia para aprender a utilizar el framework de persistencia.

    Ademas te recomiendo el foro
    http://groups.google.com.ar/group/nhibernate-hispano

    es ideal para poder hacer consultas

    saludos

    ResponderEliminar
  3. Hola Leandro.
    nesecito tu ayuda para algo que parece simple pero para mi es complicado.
    tengo un control Gridview que me jala alguna informacion de una tabla sql, lo que hice es aumentarle una columna y le puse templante un texbox para agregar un dato a la infomacion que ya me muetral el control gridview. pero ahora lo que quiro hacer es que toda la informacion del Gridview + los datos aumentados en el texbox se me graben en una tabla diferente al momento de presionar el boton grabar que esta añadido. Por favor requiero su ayuda gracias

    ResponderEliminar
  4. hola msn

    podrias recorrer las filas del grid he insertar en la otra tabla

    http://social.msdn.microsoft.com/Forums/es/netfxwebes/thread/a81c10f5-5ee5-4ad9-a6ce-f20a0638f1d1

    esto si usas BoundField, o sea va directo al Cells[n].Text, si es un template usas el FindControl


    http://social.msdn.microsoft.com/Forums/es-ES/vcses/thread/878411e4-bd2f-4cf8-942c-071a569e5481

    http://social.msdn.microsoft.com/Forums/es/netfxwebes/thread/965ed9ba-7147-43d0-ae66-0765d8d9962d

    saludos

    ResponderEliminar
  5. Hola Leandro,

    Antes que nada quería darte las gracias por los artículos que escribes que me están ayudando muchisimo.
    Estoy utilizando tu código para mostrar mensaje de confirmación y funciona bien pero después de eliminar y al refrescar la página vuelve a entrar al GridView1_RowDeleting() e intenta eliminar nuevamente lo que tenga que eliminar, hay forma de evitar esto....

    saludos

    ResponderEliminar
  6. hola Alberto

    al refrescar de que forma ?

    porque si recargas con los botones del browser estos pueden ester realizando el postback de un evento ya lanzado, peor esto sucedera con cualquier evento, si seleccionas un boton de actualizar al refrescar tambien se lanzara, no es algo exclusivo de esta accion de eliminar

    yo diria que lo valides, es la unica forma de solucionarlo, o sea si ingresa una segunda vez en el eliminar valida que ese id ya no exista y sino esta lo informas al usuario, como "el id:xx no se encuentra"

    saludos

    ResponderEliminar
  7. Hola,

    Gracias por responder y al refrescar me refería a recargar la pagina ([F5] en el navegador)...

    ... voy a hacer lo que me dices de validar que el id no exista.

    saludos

    ResponderEliminar
  8. Hola leandro, como estas
    Hace poco me encomendaron un trabajo en vbnet y me exigen que use javascript y el problema es que me cuesta adaptarme rapidamente a este lenguaje.
    Lo que me estan pidiendo es tener un gridview (con informacion alojada en una BD access), una de las columnas es un codigo que me enlaza con una imagen, alojada en un servidor y tengo que mostrarla.... me podrias llegar a arientar? Desde ya muchas gracias!

    ResponderEliminar
  9. hola nakiotio

    pero para eso no necesitas javascript

    podrias aplicar lo que comento aqui

    [ASP.NET] GridView – Edición Empleados

    saludos

    ResponderEliminar
  10. Disculpa Leandro donde declaro el javascrip o que función tengo que definir para que ejecute la acción eliminar ya que al confirmar la eliminación del dato me marca error "La acción de eliminar no es compatible con el origen de datos 'SqlDataAvisos' a menos que se especifique DeleteCommand."

    ResponderEliminar
  11. hola Luz

    el javascript se define en el propio control ImageButton
    aunque imagino quizas en tu caso no usas un template para implementar la accion de eliminar un registro, lo que no creo es que se pueda eliminar sin usar un template

    ademas has validado el control SqlDataSource que tenga definido ese comand que alli menciona el error

    SqlDataSource.DeleteCommand (Propiedad)

    valida el ejemplo del link

    saludos

    ResponderEliminar
  12. Leandro, al utilizar el ImageButton con el CommandName = "Delete" se ejecuta la propiedad OnRowDeleting del GridView verdad? Pero si además tengo otros botones o imágenes para realizar otras tareas como por ejemplo un ButtonField con el CommandName = "Download" (al cual controlo mediante la propiedad OnRowCommand del GridView), porqué al dar clic en la imagen de eliminar me salta un error en la SUB que controla el OnRowCommand? Es que se ejecutan ambas sub (la de borrar y la de comandos)?
    No se si fui claro en el mensaje...

    ResponderEliminar
  13. hola Sergio

    es que el comando Delete no solo lanza el evento OnRowDeleting sino que tambien es capturaro por el RowCommand

    por eso en este ultimo deberias definir un switch o if que valide que comando esta ingresando y hacer o no algo

    si en el RowCommand detectas que ingresa un "Delete", pasas de largo sin hacer nada y dejas que el OnRowDeleting que se deberia ejecutar a continuacion tome el control


    saludos

    ResponderEliminar
  14. hola, utilize tu codigo para validar si el usuario deseaba cancelar una solicitud desde el grid view, he realizado los cambios pertinente y me arroja este error

    Argumento de devolución o de devolución de llamadas no válido. La validación de eventos se habilita usando en la configuración o <%@ Page EnableEventValidation="true" %> en una página. Por motivos de seguridad, esta característica comprueba que los argumentos pasados a eventos de devolución o de devolución de llamadas se origina desde el control del servidor que inicialmente los procesó. Si los datos son válidos y son los que se esperaba, utilice el método ClientScriptManager.RegisterForEventValidation para registrar los datos de devolución o de devolución de llamadas para su validación.

    espero me puedas ayudar, de antemano muchas gracias

    ResponderEliminar
  15. hola Pablo

    de casualidad por medio de javascript o jquery estas cambiando algun control de asp.net ? porque ese error suele producirse cuando los datos de un control cambian y dejan de ser iguales a los que tiene el viewstate

    ademas estas seguro que es el codigo de uan simpel confirmacion en el grid lo que lo genera ? porque me parece muy raro que sea esta la causa

    digo si quitas la validacion y haces que se elimine directo no sucede este error que mencionas?

    saludos

    ResponderEliminar
  16. Hola Leandro, no tengo ningun javascript o jquery.

    en pocas palabras mi gridview muestra los datos de solicitudes, ademas de un boton que cancela, es decir, aquel boton cambia el estado de la solicitud de (Enviada o Recibida) a (cancelada)lo que hace un update a la bd medianta dataset, y no borra ninguna solicitud mostrada, solo cambia el estado. para esta accion utilizo el rowcommand.

    Algunas especificaciones:
    1.utilizo pageindexchanging para paginar los resultados de 10 en 10.
    2.utilizo rowdatabound para pintar las letras de alguna fila que cumple la condicion de estar cancelada
    3.el gridview no tiene enlace directo a un objectdatasource ya que tengo un boton buscar por parametros y hace varias consultas.
    4.adapte de buttonfield a button normal.


    de momento todo funciona correcto, sin el confirm. pero me han solicitado que antes de que se cancele alguna solicitud se le consulte al cliente(usuario) si esta seguro de eliminarla. y es aqui donde he encontrado tu codigo y lo adapte a mi necesidad.

    aqui es donde me sucedio este error.

    ResponderEliminar
  17. Como sabes a que fila hizo click?
    Si uso un commandfield ese dato me llega en el e.CommandArgument, si lo hago como lo explicas aqui, de donde obtengo el dato?

    ResponderEliminar
  18. hola Ellery

    pero alli estamos trabjando con javascript en el cliente
    si quieres obtener informacion vas a tener que usar el "this" para obtener el boton que lanza la accion y luego de este usar el parent() para obtener la celda y el parent() para obtrener el tr, y de esa forma luego acceder a otra celda y tomar el valor

    aqui
    [ASP.NET] - GridView sumar columnas con jquery
    realizo algo como eso en donde tomo la info contextual, una tecnica como esa deberias aplicar

    saludos

    ResponderEliminar
  19. Hola leandro muy buenos tus post, esto es justo lo que necesito y queria saber si podrias subir de nuevo el archivo ya que no esta disponible

    ResponderEliminar
  20. Hola.. como vas.
    Interesante tu post pero deberías permitir descargar los ejemplos.
    Exitos.

    ResponderEliminar
  21. La verdad que Leandro, sos un maestro. Gracias a vos pude pasar del querer hacer a poder hacer. Muchas gracias por el desinteresado aporte que haces a todos los que buscamos aprender mas de este lenguaje

    ResponderEliminar