Quiero evitar que se envíe un botón de envío con el evento onclick:
$j('form#userForm .button').click(function(e) {
if ($j("#zip_field").val() > 1000){
$j('form#userForm .button').attr('onclick','').unbind('click');
alert('Sorry we leveren alleen inomstreken hijen!');
e.preventDefault();
return false;
}
});
Este es el botón de enviar:
<button class="button vm-button-correct" type="submit"
onclick="javascript:return myValidator(userForm, 'savecartuser');">Opslaan</button>
Mostrará la función de “alerta” y también eliminará el evento onclick, pero el formulario se envía de todos modos. Eliminar manualmente el evento onclick antes de enviar resolverá el problema. Sin embargo, esta es la funcionalidad principal y no quiero eliminarla.
EDITAR:
Definitivamente es causado por el selector onclick. ¿Cómo puedo obligar a mi script jQuery a recargar instantáneamente el evento onclick? agregando antes del código jquery: $j('form#userForm .button').attr('onclick',''); resolverá el problema … sin embargo, mi validación ya no funcionará …
Deberá agregar el evento como un parámetro:
$j('form#userForm .button').click(function(event) { // <- goes here !
if ( parseInt($j("#zip_field").val(), 10) > 1000){
event.preventDefault();
$j('form#userForm .button').attr('onclick','').unbind('click');
alert('Sorry we leveren alleen inomstreken hijen!');
}
});
También, val() siempre devuelve una cadena, por lo que una buena práctica sería convertirlo en un número antes de compararlo con un número, y no estoy seguro si realmente está apuntando a todos .button elementos dentro #userForm dentro de la función, o si debe usar this ¿en cambio?
Si está usando jQuery 1.7+, realmente debería considerar usar on() y off() para esto.
-
Gracias, edité el código pero no funciona. ¿Supongo que el evento onclick rompe el prevent.default…?
– usuario1054080
22 de febrero de 2013 a las 15:21
-
El onclick que está en línea, siempre se ejecutará primero, y no es realmente una buena práctica tener una función en línea como esa y un controlador de eventos, probablemente debería repensar eso, e ir solo por el controlador de eventos y llamar
myvalidator()desde el controlador de eventos externo.– adeneo
22 de febrero de 2013 a las 15:41
-
muchas gracias! Ya lo descubrí;) sin embargo, no quiero romper el código central de Virtudmart. ¡Así que es por eso que trato de resolverlo así!
– usuario1054080
22 de febrero de 2013 a las 15:44
-
Puede eliminar la función onclick en la carga de la página, de la misma manera que lo está haciendo ahora dentro de la función de clic, simplemente hágalo dentro de la función document.ready en su lugar?
– adeneo
22 de febrero de 2013 a las 15:46
-
¡Lo hice y edité tu código! ¡Gracias, soy un novato, pero poco a poco lo estoy dominando!
– usuario1054080
22 de febrero de 2013 a las 15:48
Básicamente, si cambia el tipo de botón de type="submit" a type="button"dicho botón no enviará el formulario y no se necesitan soluciones alternativas.
Espero que esto ayude.
-
muchas gracias… sin embargo, estoy bastante seguro de que el evento onclick es el culpable
– usuario1054080
22 de febrero de 2013 a las 15:31
-
Esta respuesta resolvió mi caso, para mí esto debería marcarse como la respuesta correcta, ya que es más universal 🙂 ¡Muchas gracias!
– licancabur
3 de julio de 2014 a las 13:47
-
Estoy usando la validación de JQuery. tengo un boton con
type="button"¡pero aún así las devoluciones de datos del formulario cuando falla la validación! Aquí está mi pregunta.– sohaiby
27 de abril de 2015 a las 8:58
No olvide que hay argumentos de función/evento, pero debe especificar los parámetros:
$("#thing").click(function(e) {
e.preventDefault();
});
De esta forma, se detiene el envío, por lo que puedes condicionarlo.
La mejor manera es hacer todo dentro de su controlador de eventos de envío del formulario. Elimine el onclick en línea y ejecútelo dentro de la función de envío
$j('#userForm').submit(function(e) {
if (+$j("#zip_field").val() > 1000){
alert('Sorry we leveren alleen inomstreken hijen!');
return false;
}
return myValidator(userForm, 'savecartuser');
});
Creo que hay una manera más fácil:
$j('form#userForm .button').click(function(event) { // <- goes here !
if ( parseInt($j("#zip_field").val(), 10) > 1000){
event.stopPropagation();
}
});
Realmente debería hacer esto en el controlador de envío del formulario… si presiona Intro cuando el formulario tiene el foco… activará el controlador de envío y no su clic, por lo tanto, su validación se omitirá.
– wirey00
22 de febrero de 2013 a las 15:44