El envío posterior al formulario es el conjunto de código que se ejecuta después de que se activa un botón de envío. Por lo general, se usa para dejar en blanco el formulario, una vez que se envía. Por ejemplo, cuando las credenciales de inicio de sesión son incorrectas, la entrada queda en blanco en el formulario.
Acercarse:
- En primer lugar, se deben asegurar los elementos de un formulario si se carga.
- Luego, al método de envío se le agrega una función de devolución de llamada.
- Una vez que se hace clic en el botón Enviar, debería evitar las devoluciones de llamada sucesivas.
- Seguido de eso, se otorga un tiempo de espera debido a la necesidad de demora. Si no hay retraso, las acciones que deberían ocurrir después ocurrirían al principio mismo. Al igual que antes de validar la contraseña, el formulario de entrada no debe quedar en blanco.
- Luego, las acciones que deben realizarse se dan al final.
¿Cómo implementar en Javascript?
- Se puede realizar una devolución de llamada al método jQuery mediante el botón Enviar.
- Una vez que se hace clic en el botón Enviar del formulario, se activa la función de devolución de llamada. Pero, antes de eso, se debe cargar el DOM (manipulación de objetos de documentos). Una vez que se carga el DOM, llama a cualquiera de estos métodos. ( se puede usar window.on(‘load’) o document.ready() o window.ready()).
- El método preventDefault() evita que el método se active varias veces.
- Usamos el método setTimeout para realizar después de enviar con unos pocos milisegundos.
Nota: Se llama al método window.ready() cuando se cargan todos los recursos y se llama al método document.ready() cuando se carga el DOM.
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<title>
How to perform jQuery Callback
after submitting the form ?
</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
</script>
<script>
$(window).ready(function () {
$("form").submit(function (e) {
e.preventDefault();
var name = $("#name").val();
setTimeout(function () {
console.log("After timeout");
$('#name').val('');
}, 100);
alert(name + " has submitted");
})
})
</script>
</head>
<body>
<form action="">
<input type="text" id="name">
<input type="submit">
</form>
</body>
</html>
Producción:
Este método de envío de formulario activa el método de devolución de llamada, que al principio evita más devoluciones de llamada. Luego, después de un intervalo de tiempo de 100 milisegundos, se llama al método de alerta con el valor de entrada de texto.
Publicación traducida automáticamente
Artículo escrito por sathiyajith19 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA