http://www.alvarols.com/clientes/ider/ider/contacto.php
A continuación les anexo los códigos que estoy utilizando. Este es el código PHP:
Código :
<?php if($_POST) { $javascript_enabled = trim($_REQUEST['browser_check']); $nombre = trim($_REQUEST['nombre']); $empresa = trim($_REQUEST['empresa']); $ciudad = trim($_REQUEST['ciudad']); $estado= trim($_REQUEST['estado']); $telefono = trim($_REQUEST['telefono']); $email = trim($_REQUEST['email']); $comentarios = trim($_REQUEST['comentarios']); //mail settings $mail = "[email protected]"; $cabeceras = "Content-type: text/html; charset=utf-8"; $asunto = "Contacto de un cliente"; $headers = "Content-type: text/html; charset=utf-8"; $message = "<b>Nombre del contacto:</b> $nombre <br /> <b>Empresa:</b> $empresa <br /> <b>Ciudad:</b> $ciudad<br /> <b>Estado:</b> $estado<br /> <b>Teléfono:</b> $telefono<br /> <b>Email:</b> $email<br /> <b>Comentarios:</b> $comentarios<br />"; if ( $nombre == "" ) { $result = "Un nombre es requerido"; } elseif (!preg_match("/^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$/", $email)) { $result = "Escribe un correo electrónico válido"; } elseif ( $empresa == "" ) { $result = "Una empresa es requerida"; } elseif ( $ciudad == "" ) { $result = "Una ciudad es requerida"; } elseif ( $estado == "" ) { $result = "Un estado es requerido"; } elseif ( $telefono == "" ) { $result = "Un teléfono es requerido"; } elseif ( strlen($comentarios) < 10 ) { $result = "Escribe más de 10 caracteres"; } else { mail($mail,$asunto,$message,$headers); $result = "Muchas gracias, nos pondremos en contacto lo más pronto posible"; } if($javascript_enabled == "true") { echo $result; die(); } } ?>
Este es el código HTML con el que está diseñado el formulario de contacto:
Código :
<form name="contactform" id="form" method="post" action="contacto.php"> <div id="resultado"><?php if($result) echo "<div class='mensaje'>".$result."</div>"; ?></div> <br /> <label class="name">Nombre<br /><input class="text" name="nombre" type="text" value="<?php echo $nombre; ?>" /><br /></label> <span class="SeparadorHorizontalPunteado"></span> <label class="empresa">Empresa<br /><input class="text" name="empresa" type="text" value="<?php echo $empresa; ?>" /><br /></label> <span class="SeparadorHorizontalPunteado"></span> <label class="email">Email<br /><input class="text" name="email" type="text" value="<?php echo $email; ?>" /><br /></label> <span class="SeparadorHorizontalPunteado"></span> <label class="ciudad">Ciudad<br /><input class="text" name="ciudad" type="text" value="<?php echo $ciudad; ?>" /><br /></label> <span class="SeparadorHorizontalPunteado"></span> <label class="estado">Estado<br /><input class="text" name="estado" type="text" value="<?php echo $estado; ?>" /><br /></label> <span class="SeparadorHorizontalPunteado"></span> <label class="telefono">Teléfono<br /><input class="text" name="telefono" type="text" value="<?php echo $telefono; ?>" /><br /></label> <span class="SeparadorHorizontalPunteado"></span> <label class="comentarios">Comentarios<br /><textarea class="text" name="comentarios"><?php echo $comentarios; ?></textarea><br /></label> <input type="hidden" name="browser_check" value="false" /> <input type="submit" name="submit" value="Enviar Mensaje" id="submit" class="FormularioBotonEnvio" /> </form>
Y este es el Ajax:
Código :
<script type="text/javascript"> document.contactform.browser_check.value = "true"; //sets the hidden input(browser_check) value as true if the javascript is enabled. $("#submit").click(function(){ $('#result').html('<img src="http://www.tutorialstag.com/examples/images/loader.gif" class="loading-img" alt="loader image">').fadeIn(); var input_data = $('#form').serialize(); $.ajax({ type: "POST", url: "<?php echo "http://" . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']; ?>", data: input_data, success: function(msg){ $('.loading-img').remove(); //Removing the loader image because the validation is finished $('<div class="mensaje">').html(msg).appendTo('div#resultado').hide().fadeIn('slow'); //Appending the output of the php validation in the html div } }); return false; }); </script>