javascript/jquery deshabilitar el botón de enviar en el clic, de evitar la doble presentación de
-
13-12-2019 - |
Pregunta
Así que tengo el botón enviar que se parece a esto:
<a href="#" id="submitbutton"
onClick="document.getElementById('UploaderSWF').submit();">
<img src="../images/user/create-product.png" border="0" /></a>
Cuando me haga doble clic doble somete obviamente, y el problema es que Estoy guardando la información en la base de datos así que voy a tener dublicate información, y yo no quiero eso.Este cargador utiliza flash y javascript y aquí es una pequeña pieza de código que es relevante para la entrega de la cosa (por 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.Le agradezco su ayuda.Esto es realmente algo que yo era incapaz de hacer yo porque tengo un poco de experiencia con js y realmente no sabemos cómo para hacer las cosas.GRACIAS.
Solución
Pruebe esto snipped:
$('#your_submit_id').click(function(){
$(this).attr('disabled');
});
Editar 1
Oh, en su caso es un enlace y ningún botón de envío ...
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;
}
Editar 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>
Use elementos de formulario, como <input type="image" />
, para enviar un formulario, no un enlace normal.
¡Esto funciona bien!
Eche un vistazo a jquery.post () para enviar su formulario.
buena suerte.
Editar 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 ayude.
Otros consejos
Agregue lo siguiente a la onclick
:
onclick="document.getElementById('submitbutton').disabled = true;document.getElementById('UploaderSWF').submit();"
Dicho esto, usted tendrá que manejar esta doble presentar la prevención en el lado del servidor también.
De acuerdo con http://api.jquery.com/prop/ Puede ser agregar y eliminar la propiedad deshabilitada usando la función .prop (), no las funciones .attr () y .removeattr ().
para agregar la propiedad:
.prop("disabled", true);
para eliminar la propiedad:
.prop("disabled", false);
Espero que esto te ayude.
Según lo propuesto aquí (con ejemplos):
Si desea asegurarse de que el evento registrado se dispare solo una vez, debe usar la de JQUERY [ONE] [1]:
.one (eventos [, datos], manejador) devuelve: jQuery
Descripción: Adjuntar un controlador a un evento para los elementos.El controlador se ejecuta a lo sumo una vez por elemento por tipo de evento.
Esto deshabilitará todos los botones de envío y enlaces con la clase Enviar o el atributo Data-Enviar en un formulario si se hace clic:
$(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 cada forma, por cierto.Si solo desea un cierto, use la ID en lugar del formulario.Probablemente ya lo sabías, sin embargo.