mi pregunta es: estoy enviando datos atraves de ajax al servidor, para eso tengo un poco de codigo en php y js. pero lo que pasa es que cuando los datos son correctos me envia a la pantalla de php diciendome que son correctos mas no me muestra la imagen que quiero que me muestre en mi html cuando los datos so correctos, osea no quiero que me redirija a ninguna pantalla sino que me sobrescriba la imagen en mi html.
<script>
$(document).on("ready", function () {
var pet = $('#main form').attr('action');
var met = $('#main form').attr('method');
$('#main form').on('submit', function (e) {
$.ajax({
breforeSend: function () {
$('#status').html('<img src="img/10165.png" alt="" height="25px" width="25px">');
},
url: pet,
type: met,
data: $('#main form').serialize(),
success: function (resp) {
if(resp == "Correcto")
$('#status').html('<img src="img/10165.png">');
else
console.log(resp)
},
error: function (jqXHR, estado, error) {
console.log(estado)
console.log(error)
},
complete: function (jqXHR, estado) {
cosole.log(estado)
},
timeout: 3000
})
})
})
</script>
y mi funcion en php es:
<?php
$nombre = $_POST["nombre"];
$mail = $_POST["mail"];
sleep(4);
if($nombre != "" && $mail != "")
echo 'correcto';
else
echo "Incorrecto";
?>
por ultimo mi codigo en html es:
<div id="main">
<h1>Formulario de contacto</h1>
<form action="peticion.php" name="fo" method="POST" autocomplete="on">
<input type="text" name="nombre" placeholder="Nombre..." >
<input type="text" name="mail" placeholder="Correo..." >
<div style="display:block;width:60%;margin:0 auto" >
<input type="submit" name="send" value="Enviar">
<div id="status" name="status"></div>
</div>
</form>
</div>
</body>
action
cuando envías unform
, puedes usarpreventDefault
. De ese modo, seguirás en la página actual. Lo puedes agregar por ej. después de esta línea:$('#main form').on('submit', function (e) {
, de este modo:e.preventDefault(); //resto del código...
. Si sigues sin tener los resultados esperados, debes compartir el código de tu archivopeticion.php
. En el planteamiento de la pregunta no queda claro que estés manejando/devolviendo adecuadamente los datos allí.