jquery - recargar - Prevenir la redirección después de enviar el formulario
evitar reenvio de formulario al actualizar (13)
Tengo un formulario HTML que envía un correo electrónico con PHP, y cuando se envía, se redirige a esa página de PHP. ¿Hay alguna manera de evitar que este redireccionamiento suceda? Construí una animación con jQuery que quiero que ocurra en lugar de redirigir. Intenté devolver falso ;, pero no funcionaría. Aquí está mi función:
$(function() {
$(''.submit'').click(function() {
$(''#registerform'').submit();
return false;
});
});
Aquí está la etiqueta de formulario de apertura:
<form id="registerform" action="submit.php" method="post">
Y el botón de enviar:
<input type="submit" value="SUBMIT" class="submit" />
Utilizando ajax
Usando el método de solicitud jQuery Ajax puede publicar los datos de correo electrónico en un script (submit.php). Usar la opción de devolución de llamada success para animar elementos después de que se ejecute el script.
nota : sugeriría utilizar el objeto de respuesta ajax para asegurarse de que el script se ejecutó correctamente.
$(function() {
$(''.submit'').click(function() {
$.ajax({
type: ''POST'',
url: ''submit.php'',
data: ''password=p4ssw0rt'',
error: function()
{
alert("Request Failed");
},
success: function(response)
{
//EXECUTE ANIMATION HERE
});
return false;
});
})
Al igual que Bruce Armstrong sugirió en su respuesta . Sin embargo yo usaría FormData :
$(function() {
$(''form'').submit(function() {
var formData = new FormData($(this)[0]);
$.ajax({
type: ''POST'',
url: ''submit.php'',
data: formData,
processData: false,
contentType: false,
});
return false;
});
})
Deberías publicarlo con ajax, esto evitará que cambie la página y aún así obtendrás la información.
$(function() {
$(''form'').submit(function() {
$.ajax({
type: ''POST'',
url: ''submit.php'',
data: { username: $(this).name.value,
password: $(this).password.value }
});
return false;
});
})
Debes poner la devolución dentro de la llamada submit ().
$(''.submit'').click(function() {
$(''#registerform'').submit(function () {
sendContactForm();
return false;
});
//Here you can do anything after submit
}
El diseño de HTTP significa que hacer una POST con datos devolverá una página. Los diseñadores originales probablemente pensaron que esa sería una página de "resultado" de su POST.
Es normal que una aplicación PHP vuelva a la misma página, ya que no solo puede procesar la solicitud POST, sino que también puede generar una página actualizada basada en el GET original pero con la nueva información del POST. Sin embargo, no hay nada que impida que el código de su servidor proporcione una salida completamente diferente. Alternativamente, usted podría POST a una página completamente diferente.
Si no desea la salida, un método que he visto antes de que AJAX despegara fue que el servidor devolviera un código de respuesta HTTP de (creo) 250. Esto se llama "Sin contenido" y esto debería hacer que el navegador ignorar los datos.
Por supuesto, el tercer método es hacer una llamada AJAX con los datos enviados, en su lugar.
En lugar de devolver falso, puedes probar event.preventDefault (); Me gusta esto:
$(function() {
$(''#registerform'').submit(function(event) {
event.preventDefault();
$(this).submit();
});
});
La respuesta simple es disparar su llamada a un script externo a través de una solicitud AJAX. Entonces maneja la respuesta como quieras.
Probablemente tendrás que hacer solo una solicitud Ajax a tu página. Y haciendo el return false no está haciendo lo que crees que está haciendo.
Se puede utilizar como a continuación
e.preventDefault()
Si se llama a este método, la acción predeterminada del evento no se activará.
También si puedo sugerir que lea esto: .prop () vs .attr ()
Espero que te ayude,
Ejemplo de código:
$(''a'').click(function(event){
event.preventDefault();
//do what you want
}
Si desea que la información en el formulario sea procesada por la página de PHP, TIENE QUE HACER una llamada a esa página de PHP. Para evitar una redirección o actualización en este proceso, envíe la información del formulario a través de AJAX. Tal vez use el diálogo jQuery para mostrar los resultados, o su animación personalizada.
Si puede ejecutar javascript, lo que parece que puede, cree un nuevo iframe y publíquelo en ese iframe. Puede hacer <form target="iframe-id" ...> esa manera, todos los redireccionamientos suceden en el iframe y aún tiene el control de la página.
La otra solución es hacer también una publicación a través de ajax. Pero eso es un poco más complicado si la página necesita una comprobación de errores o algo así.
Aquí hay un ejemplo:
$("<iframe id=''test'' />").appendTo(document.body);
$("form").attr("target", "test");
Sin saber exactamente lo que intentas lograr aquí, es difícil decirlo, pero si pasas el tiempo para resolver este problema con javascript, una solicitud AJAX será tu mejor opción. Sin embargo, si desea hacerlo completamente en PHP, coloque esto al final de su secuencia de comandos, y debería configurarlo.
if(isset($_SERVER[''HTTP_REFERER''])){
header("Location: " . $_SERVER[''HTTP_REFERER'']);
} else {
echo "An Error";
}
Esto hará que la página cambie dos veces, pero el usuario finalizará en la página que inicia la solicitud. Esto ni siquiera es la forma correcta de hacerlo, y recomiendo encarecidamente utilizar una solicitud AJAX, pero hará el trabajo.
$(''#registerform'').submit(function(e) {
e.preventDefault();
$.ajax({
type: ''POST'',
url: ''submit.php'',
data: $(this).serialize(),
beforeSend: //do something
complete: //do something
success: //do something for example if the request response is success play your animation...
});
})