Duda con jquery validate y jquery form Tengo el siguiente formulario el cual pretendo enlazar al documento email.php.
Código HTML:
<form id="form" name="form"> <label for="nombre">Nombre: </label> <input id="nombre" name="nombre" placeholder="Escribe tu nombre" autofocus><br /> <label for="email">Email: </label> <input type="email" id="email" name="email" placeholder="Escribe tu email"><br /> <label for="destino">Destino: </label> <input type="email" id="destino" name="destino" placeholder="[email protected]" disabled><br /> <label for="mensaje">Mensaje: </label><br /> <textarea id="mensaje" name="mensaje" placeholder="Escribe tu mensaje" rows="10" cols="45"></textarea><br /> <input type="submit" id="enviar" name="enviar" value="Enviar"> <input type="reset" id="borrar" value="Borrar"> </form>
El problema está cuando en el método submitHandler intento procesar el formulario con jquery form (ajaxSubmit) tal como recomienda en la documentación de jquery validate.
Simplemente no logro el prósito de procesar el formulario e imprimir el resultado del proceso sin tener que refrescar la página.
Nota: Cuando desactivo el metodo submitHandler todo funciona bien sólo que obviamente el usuario se redirige hacia email.php, y el correo si se envía. Pero pues no es lo que quiero.
El código jquery es el siguiente:
Código:
el documento email.php es como sigue: // Para validar el formulario con jqueryValidate plugin
$('#form').validate({
rules:{
'nombre':{required: true, minlength: 3},
'email':{required: true, email: true},
'mensaje':{required: true, minlength: 15}
},
messages:{
'nombre':{required:'<br/>Debe ingresar el nombre<br/>', minlength: '<br/>Requiere mínimo 3 letras<br/>'},
'email':{required: '<br/>Debe ingresar un correo electrónico<br/>',email:'<br/>Debe ingresar el correo electrónico con el formato correcto. Por ejemplo: [email protected]<br/>'},
'mensaje':{required:'<br/>Debe ingresar algún mensaje<br/>', minlength: '<br/>Requiere mínimo 15 letras<br/>'}
},
submitHandler:function(form){
var opciones={
target: $("#formV").after(),
beforeSubmit: mostrarLoader, //funcion que se ejecuta antes de enviar el form
success: mostrarRespuesta,//funcion que se ejecuta una vez enviado el formulario
url: email.php,
type: post,
clearForm: true,
resetForm: true
};
$('#form').submit(function(){
$(this).ajaxSubmit(opciones);
return false;
});
function mostrarLoader(){
$("#formV").fadeIn("slow").after("<p>Procesando el formulario para su envio.</p>"); //muestro el loader de ajax
};
function mostrarRespuesta (responseText){
$("#sec4 form").fadeOut("slow");
$("#formV").fadeIn("slow");
$("#formV").after(responseText);
};
}
});
Código PHP:
<?php
$nombre = $_REQUEST["nombre"];
$email = $_REQUEST["email"];
$destino = "[email protected]";
$asunto = "Mensaje de cliente";
$mensaje = $_REQUEST["mensaje"];
$cuerpo = "
<html>
<head>
<title>Correo de cliente</title>
</head>
<body>
<h1 style='
text-align: left;
font-family: verdana,arial;
font-size: 21px;
color: #f00;'>De: $nombre</h1>
<h1 style='
text-align: left;
font-family: verdana,arial;
font-size: 21px;
color: #f00;'>Para: quien corresponda...</h1>
<p id='parrafo' style='
text-align: justify;
color: #000;
font-family: verdana,arial;
font-size: 16px;
line-height: 30px;'>
$mensaje
</p>
</body>
</html>
";
//para el envío en formato HTML
$headers = "MIME-Version: 1.0\r\n";
$headers .= "Content-type: text/html; charset=utf-8\r\n";
//dirección del remitente
$headers .= "From: $nombre <$email>\r\n";
//direcciones que recibirán copia
$headers .= "Cc: [email protected]\r\n";
mail($destino,$asunto,$cuerpo,$headers) or die("El email no se pudo enviar.");
if($_POST['mensaje'] != ''){
echo "Tu mensaje ha sido enviado con éxito. Prontamente responderemos al mismo.<br /><br />";
echo "Mensaje enviado por: ";
echo $_POST['nombre'];
echo "<br><br>";
echo "Correo de remitente: ";
echo $_POST['email'];
echo "<br><br>";
echo "Enviado a: ".$_POST['destino'];
echo "<br><br>";
echo "El mensaje dice: <br>";
echo $_POST['mensaje'];
}
?> 
Respuesta: Duda con jquery validate y jquery form 
Respuesta: Duda con jquery validate y jquery form 
