sábado, 23 de febrero de 2008

ASP.NET desactivar boton luego de submit

A mi me parece muy conveniente desactivar el botón que hace submit, luego que se envía la data al servidor... porque hay usuarios que tienen la manía de presionar 3 o 4 clicks a la vez. Lo cual hace que nuestra aplicación consulte más de una vez a la bd, lo cual puede causar ingreso de data duplicada o vaya Ud. a saber...
por ejemplo en el caso de si se estuviera añadiendo un nuevo usuario al sistema:
Si el usuario presiona 3 o 4 veces... puede ocurrir que lo agregue 3 o 4 veces.
Entonces, la idea es prevenir este tipo de situaciones.
Para eso, vamos a desactivar el botón que hace el submit (en este caso será imageButton).

El ejemplo lo estoy haciendo sobre una simple pagina de login, pero se puede usar para muchos escenarios.
La página web contiene un formulario llamado frmlogin, dos textbox y un botón imageButton, el cual tiene una imagen por defecto, pero la cual al enviarse el formulario (hacer submit) se reemplaza la imagen por otra igual, pero con colores plomizos, para dar la impresión de botón desactivado.Veamos el código html:












Y en el código detrás, simplemente añadimos esta línea en el Page_Load











Es todo.

8 comentarios:

Gabba dijo...
Este comentario ha sido eliminado por el autor.
Gabba dijo...

Una consulta quiero aplicar tu solucion y no me he podido.

Tengo un imagebutton que al aceptar el mismo, dispara un Store. Como esta suele tardar un rato en procesar, quisiera bloquear el boton hasta que se termine de procesar el store asi evito la repeticion de que lo ejecuten.

Mi boton lo tengo dentro de un ContentPlaceHolder, trabajo con MasterPages pero no puedo aplicar tu solucion, podrias ayudarme? Gracias!

Segundo Serrano dijo...

Hola Gabba,

me imagino que no puedes aplicar esta solución porque necesitas saber el nombre de la etiqueta html [form], debido a que usas master page.

Para tu caso, usa este código:
Page.Form.Attributes.Add("onsubmit", "document.getElementById('" & imgLogin.ClientID & "').disabled='true';")

Saludos.

Gabba dijo...

Gracias viejo,

me pasa que cuando agrego la linea directamente dejo de funcionar el boton, estare omitiendo algo? Gracias de nuevo

Segundo Serrano dijo...

Hola Gabba,
sigues teniendo el mismo problema?
tendrías que mostrarme parte de tu código para poder ayudarte.

Saludos

Gabba dijo...

Te paso el codigo Click del boton. Como tarda mucho el stored en completarse, el usuario realiza varios click y mi intencion es de bloquear algo para que solo lo pueda hacer una vez. Cuando termina, le devuelvo el control de la pagina al usuario.

Gracias viejo


Protected Sub cmdAceptar_Click(ByVal sender As Object, ByVal e As System.Web.UI.ImageClickEventArgs) Handles cmdAceptar.Click

Try

Session("endWait") = "SI"

Dim Mensaje, FechaHasta, FechaDesde As String
Dim cnnBaseDat As New SqlClient.SqlConnection(System.Configuration.ConfigurationManager.AppSettings("db"))
Dim sqlCierraLiquidacion As New SqlCommand("CierraLiquidacion", cnnBaseDat)
sqlCierraLiquidacion.CommandTimeout = 0
sqlCierraLiquidacion.CommandType = CommandType.StoredProcedure

'aca completo todas los parametros del SP

cnnBaseDat.Open()
'Ejecutar el Store Procedure
sqlCierraLiquidacion.ExecuteScalar()
cnnBaseDat.Close()

If sqlCierraLiquidacion.Parameters("@statusproc").Value.ToString() <> 0 Then

Mensaje = "La Liquidacion no se cerró correctamente vuelva a intentarlo"
Me.lblMensaje.Text = Mensaje

BloquearControles()

Exit Sub

End If

UserMsgBox("La Liquidación se ha Cerrado.")

Limpiar()

Catch ex As SqlException
Throw ex
'Controlar excepción SQL
Catch ex As Exception
'Controlar exception
Throw ex
Finally

End Try

'End If

End Sub

Gabba dijo...

Hola, agregue este codigo en el load y funciono el evitar el 2 click.
Me.cmdAceptar.Attributes.Add("onclick", " this.disabled = true; " + ClientScript.GetPostBackEventReference(cmdAceptar, Nothing) + ";")

se puede bloquear toda la pagina de algun modo hasta que termine de procesar el SP?

Unknown dijo...

Hola
Parece que hay algún problema con las imágenes de tu página. El código que dices agregas en el evento Page_Load, no se ve. ¿Podrías corregirlo?

Gracias