Hola amigos buenas noches, requiero su apoyo en lo siguiente.
Estoy creando un formulario de contacto HTML5 usando JS y validando el envío mediante AJAX.
Lo que necesito es que al enviarse el formulario se actualice al cabo de unos 5 segundos de manera que los campos y el formulario en sí quede original.
Acá mi form HTML
<form method="post" class="contacto">
<fieldset>
<div><label>Nombre:</label><input type="text" class="nombre" name="nombre" /></div>
<div><label>Email:</label><input type="text" class="email" name="email" /></div>
<div><label>Telefono:</label><input type="text" class="telefono" name="telefono" /></div>
<div><label>Asunto:</label><input type="text" class="asunto" name="asunto" /></div>
<div><label>Mensaje:</label><textarea cols="30" rows="5" class="mensaje" name="mensaje" ></textarea></div>
<div class="ultimo">
<img src="ajax.gif" class="ajaxgif hide" />
<div class="msg" id="msg"></div>
<button class="boton_envio">Enviar Mensaje</button>
</div>
</fieldset>
</form>
Acá mi ajax
(function(){
$(".boton_envio").click(function() {
var nombre = $(".nombre").val();
email = $(".email").val();
validacion_email = /^[a-zA-Z0-9_\.\-]+@[a-zA-Z0-9\-]+\.[a-zA-Z0-9\-\.]+$/;
telefono = $(".telefono").val();
mensaje = $(".mensaje").val();
if (nombre == "") {
$(".nombre").focus();
alert('Por favor ingresa tu nombre');
return false;
}
else if(email == "" || !validacion_email.test(email)){
$(".email").focus();
alert('Por favor ingresa tu eMail');
return false;
}else if(telefono == ""){
$(".telefono").focus();
alert('Por favor ingresa tu número telefónico');
return false;
}else if(mensaje == ""){
$(".mensaje").focus();
alert('Por favor ingresa tu mensaje');
return false;
}else{
$('.ajaxgif').removeClass('hide');
var datos = 'nombre='+ nombre + '&email=' + email + '&telefono=' + telefono + '&mensaje=' + mensaje;
$.ajax({
type: "POST",
url: "proceso.php",
data: datos,
success: function() {
$('.ajaxgif').hide();
$('.msg').text('Mensaje enviado, pronto será contactado!').addClass('msg_ok').animate({ 'right' : '130px' }, 300);
},
error: function() {
$('.ajaxgif').hide();
$('.msg').text('Error, verifique los datos!').addClass('msg_error').animate({ 'right' : '130px' }, 300);
}
});
return false;
}
});
acá dejo el php donde lo proceso
if($nombre != '' && $email != '' && $telefono != '' && $mensaje != ''){
mail($dest,$asunto,$cuerpo,$headers); //ENVIAR!
} ?>
Gracias de antemano.