Donde tenemos código js que envía un formulario en lugar de simplemente enviar el formulario como:
form.submit();¿Deberíamos enviar un evento (burbujeante, cancelable) para permitir que otros posibles oyentes de eventos js tengan la oportunidad de manejar el envío del formulario?
form.dispatchEvent(new Event('submit', {bubbles: true, cancelable: true}));Parece que esto permite que nuestro código funcione mejor con otros. Si esto es cierto, ¿por qué no se impulsa más este patrón?
¡HTMLFormElement.requestSubmit() al rescate!
En la mayoría de los casos en los que un formulario debe enviarse mediante programación a través de JavaScript, es aconsejable usar requestSubmit() en lugar de submit() . Hacerlo garantiza que los controladores de envío tendrán la oportunidad de manejar el evento de envío. Use submit() solo cuando desee enviar explícitamente el formulario ignorando cualquier oyente de evento de envío registrado y validación de formulario.
Simplemente no estaba al tanto de este nuevo método de formulario.
Consulte https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/submit
El método HTMLFormElement.submit() envía un
<form>dado.Este método es similar, pero no idéntico, a la activación del
<button>de envío de un formulario. Sin embargo, al invocar este método directamente:
- No se genera ningún evento de envío. En particular, el controlador de eventos
onsubmitdel formulario no se ejecuta.- La validación de restricciones no se activa.
El método
HTMLFormElement.requestSubmit()es idéntico a activar el<button>de envío de un formulario y no tiene estas diferencias.
Y notas de uso de https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/requestSubmit
La pregunta obvia es: ¿Por qué existe este método [
requestSubmit()], cuando hemos tenido el método desubmit()desde el principio de los tiempos?La respuesta es simple.
submit()envía el formulario, pero eso es todo lo que hace.requestSubmit(), por otro lado, actúa como si se hiciera clic en un botón de envío. El contenido del formulario se valida y el formulario se envía solo si la validación se realiza correctamente. Una vez que se ha enviado el formulario, el evento de envío se envía de vuelta al objeto del formulario.