example - Debería jQuery''s $(form).submit(); no desencadenar onSubmit dentro de la etiqueta del formulario?

serialize jquery

Question

Tengo lo siguiente:

<script type="text/javascript">
function CancelFormButton(button) {
$(button.form).submit();
}
</script>
<form onsubmit="alert(''here'');">
<input type="button" value="Cancel" onClick="CancelFormButton(this);" />
</form>

Cuando hago clic en el botón "Cancelar", la publicación de la etiqueta del formulario no se desencadena.

En cambio, esta línea envía el formulario con éxito: $(button.form).submit(); pero omite la alert(''here''); dentro del onsubmit en la etiqueta de formulario.

¿Es correcto o estoy haciendo algo mal?

Por cierto, en este caso, quiero esta funcionalidad, pero me pregunto si me voy a encontrar con un problema en un navegador donde se activa la publicación.

Answer 1

En lugar de

$("form").submit()

prueba esto

 $("<input type=''submit'' id=''btn_tmpSubmit''/>").css(''display'',''none'').appendTo(''form'');
$("#btn_tmpSubmit").click();

Answer 2

Encontré esta pregunta serval hace años.

Recientemente traté de "reescribir" el método de envío. a continuación está mi código

window.onload= function (){
for(var i= 0;i<document.forms.length;i++){
(function (p){
var form= document.forms[i];
var originFn= form.submit;
form.submit=function (){
//do something you like
alert("submitting "+form.id+" using submit method !");
originFn();
}
form.onsubmit= function (){
alert("submitting "+form.id+" with onsubmit event !");
}
})(i);
}

}

<form method="get" action="" id="form1">
<input type="submit" value="提交form1" />
<input type="button" name="" id="" value="button模拟提交1" onclick="document.forms[0].submit();" /></form>

Lo hizo en IE, pero falló en otros navegadores por la misma razón que "cletus"

Answer 3

Intente desencadenar () evento en su función:

$("form").trigger(''submit''); // and then... do submit()

Answer 4

La solución más fácil a la solución es crear una entrada ''temporal'' con el tipo enviar y hacer clic en el gatillo:

var submitInput = $("<input type=''submit'' />");
$("#aspnetForm").append(submitInput);
submitInput.trigger("click");

Answer 5

Lo siento, malinterpreté tu pregunta.

De acuerdo con Javascript - capturando onsubmit al llamar a form.submit () :

Recientemente me preguntaron: "¿Por qué no se activa el evento form.onsubmit cuando envío mi formulario mediante javascript?"

La respuesta: los navegadores actuales no se adhieren a esta parte de la especificación html. El evento solo se dispara cuando es activado por un usuario y no se dispara cuando se activa por código.

(énfasis añadido).

Nota: "activado por un usuario" también incluye presionar los botones de envío (probablemente incluyendo el comportamiento de envío predeterminado de la tecla Intro, pero no lo he intentado). Tampoco, creo, se activa si usted (con código) hace clic en un botón de enviar.

Answer 6

Mi solución simple:

$("form").children(''input[type="submit"]'').click();

Es trabajo para mi

Answer 7

Supongo que es razonable querer este comportamiento en algunos casos, pero yo diría que el código que no desencadena el envío de un formulario debe ser (siempre) el comportamiento predeterminado. Supongamos que quiere ver el envío de un formulario con

$("form").submit(function(e){
e.preventDefault();
});

y luego validar la entrada. Si el código pudiera desencadenar controladores de envío, nunca podría incluir

$("form").submit()

dentro de este manejador porque daría como resultado un bucle infinito (se llamaría al MISMO controlador, evitaría el envío, se validaría y se volvería a enviar). Debe poder enviar manualmente un formulario dentro de un controlador de envío sin activar el mismo controlador.

Me doy cuenta de que esto NO RESPONDE la pregunta directamente, pero hay muchas otras respuestas en esta página sobre cómo se puede piratear esta funcionalidad, y sentí que era necesario señalar esto (y es demasiado tiempo para hacer un comentario).

Answer 8

trigger (''submit'') no funciona. Debido a que el método de envío no se activa. el siguiente código funciona para mí, llame al método de envío cuando use este código:

$("form").find('':submit'').click();

Answer 9

This trabajo solucionará el problema encontrado por @Cletus.

function submitForm(form) {
//get the form element''s document to create the input control with
//(this way will work across windows in IE8)
var button = form.ownerDocument.createElement(''input'');
//make sure it can''t be seen/disrupts layout (even momentarily)
button.style.display = ''none'';
//make it such that it will invoke submit if clicked
button.type = ''submit'';
//append it and click it
form.appendChild(button).click();
//if it was prevented, make sure we don''t get a build up of buttons
form.removeChild(button);
}

Funcionará en todos los navegadores modernos.
Funcionará a través de pestañas / ventanas hijas generadas (sí, incluso en IE <9).
¡Y está en vainilla!

Solo páselo una referencia DOM a un elemento de formulario y se asegurará de que todos los oyentes adjuntos, el onsubmit y (si no se lo impidió para entonces) finalmente, envíen el formulario.