asp.net - validator - input button onclick asp net

Impedir doble clic en el botón asp.net

Question

Me doy cuenta de que se ha formulado esta pregunta, pero ninguna de las respuestas funcionó para mi proyecto.

Tengo un botón que al hacer clic llama a una API, por lo que hay un retraso de 1 segundo.

He intentado varias cosas, nada funciona.

btnSave.Attributes.Add("onclick", " this.disabled = true; " + ClientScript.GetPostBackEventReference(btnSave, null) + ";");

Incluso eso no hace nada.

Answer 1

Al principio mi solución es así:

<script>
function disableButton(btn) {
setTimeout(function () { btn.disabled = true; }, 20);
return true;
}
</script>
<asp:Button runat="server" ID="btnSave" Text="Save" OnClick="btnSave_Click" OnClientClick="return disableButton(this);" />

Sin setTimeout, el botón se deshabilitará de inmediato y luego el evento OnClick no se activará. El inconveniente de este enfoque es que el botón Guardar ya no será accesible si falla alguna validación o si ocurre algún error.

Por lo tanto, no creo que deshabilitar el botón sea una buena solución y proponga otra solución:

 function disableButton(btn) {
if (btn.hasclicked) return false;
btn.hasclicked = 1;
btn.onmouseenter = function () { this.hasclicked = 0; };
return true;
}

Pero mi colega señala que si el procesamiento posterior es muy lento, antes de que finalice, el usuario todavía puede realizar la devolución de datos doble al hacer clic en el botón. Así que descubrí otras dos soluciones:

1. Ejecute la validación desde el cliente antes de enviar el formulario. Pero si su página contiene múltiples ValidationGroup, se dice que el siguiente Page_ClientValidate () debe llamarse varias veces con un parámetro ValidationGroup pasado: por ejemplo, Page_ClientValidate ("group1"):

function disableButton(btn) {
if (Page_ClientValidate) {
Page_ClientValidate();
if (!Page_IsValid) {
btn.setAttribute("btnClicked", "n");
return true;
}
}
if (btn.getAttribute("btnClicked") == "y") {
return false;
} else {
btn.setAttribute("btnClicked", "y");
return true;
}
}

2. Dado que ASP.NET solo tiene un formulario en una página (no ASP.NET MVC), también podemos permitir que el evento onsubmit client del formulario para interceptar el doble clic:

   function disableButton(btn) {
   $("form").submit(function () {
   if (btn.getAttribute("btnClicked") == "y")
   return false;
   else
   btn.setAttribute("btnClicked", "y");
   return true;
   });}

   Pediré a QA que pruebe estos dos enfoques (Edición posterior: QA ha demostrado que es muy peligroso usar este enfoque. Consulte mis siguientes comentarios para obtener más información ).

Answer 2

Esta solución es simple y efectiva. En tu botón incluye este código:

OnClientClick="return CheckDouble();"

Y donde quiera que desee su JavaScript, por ejemplo, en la parte inferior de su página:

<script type="text/javascript">
var submit = 0;
function CheckDouble() {
if (++submit > 1) {
alert(''This sometimes takes a few seconds - please be patient.'');
return false;
}
}
</script>

Answer 3

La mayoría de las sugerencias anteriores no funcionaron para mí. El que sí funcionó fue el siguiente por tezzo:

Me.btnSave.Attributes.Add("onclick", "this.disabled=true;")
Me.btnSave.UseSubmitBehavior = False

Más simple aún, en lugar de usar lo anterior en el código subyacente, solo use lo siguiente:

 <asp:Button ID="btnSave" runat="server" Text="Save"
UseSubmitBehavior="false"
OnClientClick="this.disabled=''true'';"
</asp:button>

UseSubmitBehavior = "false" es la clave.

Answer 4

Prevenir doble clic. Por favor agregue el código a continuación en su página aspx

<script type = "text/javascript">
function DisableButton() {
document.getElementById("<%=Button1.ClientID %>").disabled = true;
}
window.onbeforeunload = DisableButton;
</script>

Answer 5

Prevenir doble clic. Por favor agregue el código a continuación en su página aspx.

<script type="text/javascript" language="javascript">
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
function BeginRequestHandler(sender, args) { var oControl = args.get_postBackElement(); oControl.disabled = true; }
</script>

Answer 6

Puedes evitar hacer doble clic usando este código:

Me.btnSave.Attributes.Add("onclick", "this.disabled=true;")
Me.btnSave.UseSubmitBehavior = False

Así que puedes usar btnSave_Click para llamar a tu API.

Por lo general, tengo muchos Validators en mi Page : configuración Validator.SetFocusOnError = True Puedo ejecutar este código para volver a habilitar el botón de guardar si falla una validación.

Me.YourControl.Attributes.Add("onfocus", Me.btnSave.ClientID & ".removeAttribute(''disabled'');")