Javascript/jQuery desactivar el botón de enviar el clic, evitar la doble presentación de

Así que tengo el botón que tiene este aspecto presentar:Javascript/jQuery desactivar el botón de enviar el clic, evitar la doble presentación de

<a href="#" id="submitbutton" 
onClick="document.getElementById('UploaderSWF').submit();"> 
<img src="../images/user/create-product.png" border="0" /></a>

Cuando hago doble clic en él dobles somete obviamente, y el problema es que I' Estoy guardando la información en la base de datos, así que tendré allí la información duplicada, y no quiero eso. Este cargador utiliza flash y javscript y aquí es una pequeña pieza de código que es relevante para la cosa presentar (si ayuda)

$.fn.agileUploaderSubmit = function() { 
    if($.browser.msie && $.browser.version == '6.0') { 
     window.document.agileUploaderSWF.submit(); 
    } else { 
     document.getElementById('agileUploaderSWF').submit(); 
     return false; 
    } 
}

Gracias chicos. Agradezco tu ayuda. Esto es realmente algo que no pude hacer yo mismo porque tengo tan poca experiencia con js y realmente no sé cómo para hacer cosas. GRACIAS.

Fuente

2012-07-28 inrob

Prueba esto cortó:

$('#your_submit_id').click(function(){ 
    $(this).attr('disabled'); 
});

editar 1

Oh, en su caso, es un enlace y sin botón de enviar ...

var submitted = false; 

$.fn.agileUploaderSubmit = function() { 
    if (false == submitted) 
    { 
     submitted = true; 

     if($.browser.msie && $.browser.version == '6.0') { 
      window.document.agileUploaderSWF.submit(); 
     } else { 
      document.getElementById('agileUploaderSWF').submit(); 
     } 
    } 

    return false; 
}

edición 2

Para simplificar esto, intente esto:

<!doctype html> 

<html dir="ltr" lang="en"> 

<head> 

<meta charset="utf-8" /> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 

<script type="text/javascript"> 
<!--//--><![CDATA[//><!-- 
    $(document).ready(function() 
    { 
     $('#yourSubmitId').click(function() 
     { 
      $(this).attr('disabled',true); 

      /* your submit stuff here */ 

      return false; 
     }); 
    }); 
//--><!]]> 
</script> 

</head> 
<body> 

<form id="yourFormId" name="yourFormId" method="post" action="#"> 
    <input type="image" id="yourSubmitId" name="yourSubmitId" src="yourImage.png" alt="Submit" /> 
</form> 

</body> 
</html>

elementos Uso de formularios, como <input type="image" />, para enviar un formulario no es un enlace normal.

¡Esto funciona bien!

Eche un vistazo a jQuery.post() para enviar su formulario.

Buena suerte.

edición 3

Esto funciona bien para mí también:

<!doctype html> 

<html dir="ltr" lang="en"> 

<head> 

<meta charset="utf-8" /> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 

<script type="text/javascript"> 
<!--//--><![CDATA[//><!-- 
    $(document).ready(function() 
    { 
     var agileUploaderSWFsubmitted = false; 

     $('#submitbutton').click(function() 
     { 
      if (false == agileUploaderSWFsubmitted) 
      { 
       agileUploaderSWFsubmitted = true; 

       //console.log('click event triggered'); 

       if ($.browser.msie && $.browser.version == '6.0') 
       { 
        window.document.agileUploaderSWF.submit(); 
       } 
       else 
       { 
        document.getElementById('agileUploaderSWF').submit(); 
       } 
      } 

      return false; 
     }); 
    }); 
//--><!]]> 
</script> 

</head> 
<body> 

<form id="agileUploaderSWF" name="agileUploaderSWF" method="post" action="http://your.action/script.php"> 
    <input type="text" id="agileUploaderSWF_text" name="agileUploaderSWF_text" /> 
</form> 

<a href="#" id="submitbutton"><img src="../images/user/create-product.png" border="0" /></a> 

</body> 
</html>

Esperemos que esto ayuda.

Fuente

2012-07-28 23:04:17 Raisch

Gracias lo intentaré. – inrob

Hola Raisch.Gracias por tu solución. Apliqué tu segundo código y realmente no funcionó. Todavía envía más de una vez. ¿Debo aplicar el primer bloque de código también? – inrob

@bornie - No hay problema, por lo que puede aceptar esta respuesta. :-) – Raisch

Añadir lo siguiente a la onclick:

onclick="document.getElementById('submitbutton').disabled = true;document.getElementById('UploaderSWF').submit();"

Dicho esto, usted tendrá que manejar este doble presentar la prevención en el lado servidor también.

Fuente

2012-07-28 23:06:25 Nivas

Gracias lo intentaré. No hay problema con el lado del servidor. Puedo hacerlo, soy consciente de que no puedo confiar en js solo porque a veces los usuarios deshabilitan el soporte de JavaScript en sus navegadores. – inrob

Este usuario usa jquery. No veo la necesidad de un atributo onClick o document.getElementById. – Daedalus

@bornie, he hecho una edición. Se suponía que era 'document.getElementById ('' ** 'submitbutton' **'') .disabled' – Nivas

-1

Esto desactivará todos los botones de envío y vínculos con la clase o el atributo enviar datos a enviar en un formulario si se hace clic en uno:

$(document).ready(function() { 
    $('form').submit(function() { 
     $(this).find('input[type="submit"]').attr('disabled', true); 
     $(this).find('a[data-submit], a.submit').click(function() { 
      return false; 
     }); 
    } 
});

Esto se aplica automáticamente a todas las formas, por cierto. Si solo quieres una determinada, usa la identificación en lugar de la forma. Sin embargo, probablemente ya lo sabías.

Fuente

2012-07-29 03:16:14 ileri

Bueno, el problema es que si puede ver con más cuidado, el botón Enviar no está dentro de

. Está separado. ¿Crees que tu código sigue siendo válido? – inrob

Javascript/jQuery desactivar el botón de enviar el clic, evitar la doble presentación de

Respuesta

Cuestiones relacionadas