Hola muy buenas estoy haciendo pruebas de un formulario que se envia por correo con jquery
esta en este el link
pero el problema esta en que al hacer las comprobaciones las hace bien y me la muestra en la misma pagina,,,,pero cuando por ejemplo, no pongo un email valido,me lo hace bien,,,, el problema esta en cuando le doy a ENVIAR no sale en la misma pagina el resultado de mensaje enviado sino que sale en otra pagina en blanco y tambien estoy intentando poner en form action="" en blanco pero entonces no hace, pero como lo habia visto en otros ejemplos
de todas formas pongo aqui los codigos
html
Código PHP:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="form.js"></script>
<div class="reservasform">
<div class="Contact">
<!--<img src="imagenes/agenda.png" width="65" height="65" align="left" /><h2>Reservas/Contacto</h2>
<p>Bienvenido al formulario de Contacto y Reservas, donde le invitamos contactar con nosotros o hacer una reserva de una Habitacion para disfrutar de nuestras grandes instalaciones y poder disfrutar de unas vacaciones inolvidables.</p>-->
<img src="imagenes/correo.png" width="65" height="65" align="left" /><h2>Formulario Reservas/Contacto</h2>
<p> </p>
<div id="response">
</div>
<form action="mail.php" method="post" id="contactform">
<ol>
<li>
<label>-Fecha de Entrada:</label>
<input type="text" name="datepicker" id="datepicker" class="text2" readonly="readonly" size="12" />
</li>
<li>
<label> -Fecha de Salida:</label>
<input type="text" name="datepicker2" id="datepicker2" class="text2" readonly="readonly" size="12" />
</li>
<li>
<label>-Tipo de habitación:</label>
<select class="tipohabitacion" name="tipo_habitacion">
<option>Seleccionar...</option>
<option value="Habitación individual" >Habitación individual</option><option value="Habitación doble" >Habitación doble</option>
</select>
</li>
<li>
<label for="Telefono">-Telefono*<br />
<span>Intruduce tu numero completo </span></label>
<input id="Telefono" name="Telefono" class="text" />
</li>
<li>
<label for="name">-Nombre*<br />
<span>Intruduce tu nombre completo </span></label>
<input id="name" name="name" class="text" />
</li>
<li>
<label for="email">-E-mail*<br />
<span>E-mail valido</span></label>
<input id="email" name="email" class="text" />
</li>
<li>
<label for="message">-Descripcion*<br />
<span>Descripcion del mensaje</span></label>
<textarea id="message" name="message" rows="4" cols="50"></textarea>
</li>
<li class="buttons">
<input type="submit" value="Enviar mensaje" id="sendmail" name="sendmail"/>
</li>
</ol>
</form>
</div>
</div>
el archivo form.js que hace la compracion y donde tiene que salir el mensaje de valido
Código PHP:
$(document).ready(function(){
$("#sendmail").click(function(){
var valid = '';
var isr = ' is required.';
var Telefono = $("#Telefono").val();
var name = $("#name").val();
var email = $("#email").val();
var message = $("#message").val();
if (name.length<1) {
valid += '<br />Name'+isr;
}
if (!email.match(/^([a-z0-9._-]+@[a-z0-9._-]+.[a-z]{2,4}$)/i)) {
valid += '<br />Un E-mail Valido'+isr;
}
if (Telefono.length<1) {
valid += '<br />Telefono'+isr;
}
if (message.length<1) {
valid += '<br />Descripcion'+isr;
}
if (valid!='') {
$("#response").fadeIn("slow");
$("#response").html("Error:"+valid);
}
else {
var datastr ='name=' + name + '&email=' + email + '&Telefono=' + Telefono + '&Message=' + Message;
$("#response").css("display", "block");
$("#response").html("Sending message .... ");
$("#response").fadeIn("slow");
setTimeout("send('"+datastr+"')",2000);
}
return false;
});
});
function send(datastr){
$.ajax({
type: "POST",
url: "mail.php",
data: datastr,
cache: false,
success: function(html){
$("#response").fadeIn("slow");
$("#response").html("<h2>Formulario Enviado</h2>")
setTimeout('$("#response").fadeOut("slow")',2000);
}
});
}
y el archivo php mail.php
Código PHP:
<?php
$FechaEntrada = $_POST['datepicker'];
$FechaSalida = $_POST['datepicker2'];
$tipo_habitacion = $_POST['tipo_habitacion'];
$Telefono = $_POST['Telefono'];
$name = $_POST['name'];
$email = $_POST['email'];
$Descripcion= $_POST['message'];
$to = "[email protected]";
$subject ="Nuevo mensaje Para Hostal Regina";
$message =" Fecha de Entrada: ".$FechaEntrada."\n";
$message .=" Fecha de Salida : ".$FechaSalida."\n";
$message .=" Tipo Habitacion : ".$tipo_habitacion."\n";
$message .=" Telefono: ".$Telefono."\n";
$message .=" Nombre : ".$name."\n";
$message .=" E-mail : ".$email."\n";
$message .=" Descripcion del Mensaje : ".$Descripcion;
if(mail($to, $subject,$message)){
echo "<center><div style=\"background-color: #900;
font: bold 16px Georgia;
text-align: center;
padding-top:25px;
border:3px solid #399;
width:550px;
height:75px;\">Mensaje Enviado!, Gracias'<br><a href=\"reservashostalnerja.html\"><img src=\"imagenes/back.png\"</a></div></center>";
}
else{
echo "No se ha podido enviar el mensaje por favor revise el servidor";
}
?> el tema esta que no me lo muestre el resultado en php si no jquery con el lo estoy haciendo