c# - diferencia - onclientclick and onclick

OnclientClick y OnClick no funcionan al mismo tiempo?

Question

Tengo un botón como el siguiente,

<asp:Button ID="pagerLeftButton" runat="server" OnClientClick="disable(this)" onclick="pager_Left_Click" Text="<" />

Cuando uso mi botón así, onclick no está disparando. Cuando elimino OnClientClick, onclick se activa.

Lo que tengo que hacer es deshabilitar el botón durante la devolución de datos y habilitarlo después de que finalice la devolución de datos.

Editar: información adicional:

Agregué punto de interrupción a mis funciones de disparo es parte de c # y estoy depurando, no están disparando con seguridad. Esas funciones son como

protected void pager_Left_Click(object sender, EventArgs e)
{
//Do smthing.
}
protected void pager_Right_Click(object sender, EventArgs e)
{
//Do smthing.
}

y cuando hago clic en mi botón, se deshabilita durante 1-2 segundos y se habilita automáticamente, pero no estoy seguro de por qué está habilitado. No agregué ninguna parte para que se habilite nuevamente.

Answer 1

¿Qué ocurre si no configura inmediatamente el botón como deshabilitado, sino que lo demora a través de setTimeout? Su función ''disable'' volverá y el envío continuará.

Answer 2

De este artículo en web.archive.org :

El truco consiste en utilizar las propiedades OnClientClick y UseSubmitBehavior del control del botón. Hay otros métodos, que incluyen código en el lado del servidor para agregar atributos, pero creo que la simplicidad de hacerlo de esta manera es mucho más atractiva:

<asp:Button runat="server" ID="BtnSubmit"  OnClientClick="this.disabled = true; this.value = ''Submitting...'';"   UseSubmitBehavior="false"  OnClick="BtnSubmit_Click"  Text="Submit Me!" />

OnClientClick le permite agregar secuencias de comandos OnClick del lado del cliente. En este caso, JavaScript desactivará el elemento del botón y cambiará su valor de texto a un mensaje de progreso. Cuando se complete la devolución de datos, la página recién renderizada revertirá el botón a su estado inicial sin ningún trabajo adicional.

El único inconveniente que presenta la desactivación de un botón Enviar en el lado del cliente es que cancelará el envío del navegador y, por lo tanto, la devolución de datos. Al establecer la propiedad UseSubmitBehavior en falso, se indica a .NET que inserte el script de cliente necesario para iniciar la devolución de datos de todos modos, en lugar de confiar en el comportamiento de envío de formularios del navegador. En este caso, el código que inyecta sería:

__doPostBack(''BtnSubmit'','''')

Esto se agrega al final de nuestro código OnClientClick, dándonos este HTML renderizado:

<input type="button" name="BtnSubmit"  onclick="this.disabled = true; this.value =''Submitting...'';__doPostBack(''BtnSubmit'','''')"  value="Submit Me!" id="BtnSubmit" />

Esto da un buen efecto de desactivación de botón y procesamiento de texto, mientras se completa la devolución de datos.

Answer 3

Hay dos problemas aquí:

La desactivación del botón en el lado del cliente evita la devolución de datos

Para superar esto, deshabilite el botón después del evento JavaScript onclick . Una forma fácil de hacerlo es usar setTimeout como lo sugiere esta respuesta .

Además, el código OnClientClick ejecuta incluso si la validación de ASP.NET falla, por lo que probablemente sea una buena idea agregar un cheque para Page_IsValid . Esto asegura que el botón no se desactivará si falla la validación.

OnClientClick="(function(button) { setTimeout(function () { if (Page_IsValid) button.disabled = true; }, 0); })(this);"

Es mejor colocar todo este código JavaScript en su propia función como lo muestra la pregunta:

OnClientClick="disable(this);"

function disable(button) {
    setTimeout(function () {
        if (Page_IsValid)
            button.disabled = true;
    }, 0);
}

Desactivar el botón en el lado del cliente no lo deshabilita en el lado del servidor

Para superar esto, deshabilite el botón en el lado del servidor. Por ejemplo, en el controlador de eventos OnClick :

OnClick="Button1_Click"

protected void Button1_Click(object sender, EventArgs e)
{
    ((Button)sender).Enabled = false;
}

Por último, tenga en cuenta que evitar la duplicación de botones no impide que dos usuarios diferentes envíen los mismos datos al mismo tiempo. Asegúrese de dar cuenta de eso en el lado del servidor.

Answer 4

OnClientClick parece ser muy quisquilloso cuando se usa con OnClick.

Intenté sin éxito con los siguientes casos de uso:

OnClientClick="return ValidateSearch();" 
OnClientClick="if(ValidateSearch()) return true;"
OnClientClick="ValidateSearch();"

Pero no funcionaron. Lo siguiente funcionó:

<asp:Button ID="keywordSearch" runat="server" Text="Search" TabIndex="1" 
  OnClick="keywordSearch_Click" 
  OnClientClick="if (!ValidateSearch()) { return false;};" />

Answer 5

Su JavaScript está bien, a menos que tenga otros scripts en ejecución en esta página que pueden corromper todo. Puedes verificar esto usando Firebug .

Ahora probé un poco y parece que ASP.net ignora los controles desactivados. Básicamente se emite la devolución de datos, pero probablemente el marco ignora dichos eventos ya que "asume" que un botón desactivado no puede generar ninguna devolución de datos y, por lo tanto, ignora los manejadores posiblemente adjuntos. Ahora bien, este es solo mi razonamiento personal, uno podría usar Reflector para verificar esto con más profundidad.

Como solución, en realidad podría tratar de deshabilitarlo más adelante, básicamente demora la llamada control.disabled = "disabled" utilizando un JavaTimer u otra funcionalidad. De esta forma, primero se emite la devolución de datos al servidor antes de que la función JavaScript desactive el control. No lo probé pero podría funcionar

Answer 6

Vinay (arriba) dio una solución efectiva. Lo que está causando que el evento OnClick del botón no funcione después de la función de evento OnClientClick es que MS lo ha definido donde, una vez que el botón está deshabilitado (en la función llamada por el evento OnClientClick), el botón "honra" esto al no tratar de completar la actividad del botón llamando al método definido del evento OnClick.

Luché varias horas tratando de resolver esto. Una vez que eliminé la declaración para desactivar el botón de enviar (que estaba dentro de la función OnClientClick), se llamó al método OnClick sin más problemas.

Microsoft, si está escuchando, una vez que se hace clic en el botón, debe completar su actividad asignada, incluso si se deshabilita durante una parte de esta actividad. Siempre que no se deshabilite cuando se hace clic en él, debe completar todos los métodos asignados.

Answer 7

función UpdateClick (btn) {

    for (i = 0; i < Page_Validators.length; i++) {

        ValidatorValidate(Page_Validators[i]);

        if (Page_Validators[i].isvalid == false)

            return false;
    }

    btn.disabled = ''false'';

    btn.value = ''Please Wait...'';

    return true;
}