ENVIAR MAIL POR PHPmailer VALIDANDO Y POR AJAX
El primer bloque Jquery valida las entradas del form.
El segundo envía a mailprocesar.php por post de AJAX estos valores. Luego este script envía el mail y devuelve el control a la página, la cual esconde el gif esperando y cambia el texto a mensaje enviado.
Finalmente debemos incluir a PHPMailerAutoload.php y junto a este archivo tener a class.phpmailer.php y class.smtp.php (para bajarlos click aquí).
En el código queda explicado cada parámetro del envío.
						
1) Script JAVASCRIPT para validar y AJAX

<script>
	$(document).ready(function(){
		$(".err").hide();
		$("#enviar").click(function(){					//cuando clico enviar
			// -----------------------------validacion
			$(".err").css("visibility","visible");		//esto evita parpadeo al cargar
			$(".err").hide();							//escondo el mensaje de error
			var nombre=$("input#txtNombre").val();		//recupero el nombre
			if (nombre==""){
				$("#msgnombre").show();
				$("input#txtNombre").focus();
				return false;
			}
			var email=$("input#txtEmail").val();	
			re = /^[+\w-.&]+\@[\w-.&]+\.\w+/;
			if (!re.test(email)) {	
				$("#msgemail").show();
				$("input#txtEmail").focus();
				return false;
			}
			var te=$("input#txtTel").val();	
			if (te==""){
				$("#msgtel").show();
				$("input#txtTel").focus();
				return false;
			}
			var comentario=$("#TxtCom").val();
			if (comentario==""){
				$("#msgcomentario").show();
				$("textarea#txtCom").focus();
				return false;
			}
			// fin validacion
			var envio = 'txtNombre=' + escape(nombre) + '&txtTel=' + escape(te) + '&txtEmail=' + escape(email) + '&txtCom=' + escape(comentario) ;
			// funcion enviadora
			$("#esperando").css("visibility","visible");
			$('#msg').html("Enviando consulta...");  
			$.ajax({  
				type: "POST",  
				url: "tec-php-enviamailajax-procesar.php",  
				data: envio,  
				success: function(datos) { 
					if(datos.indexOf('Exito') == 0){
						$("#msg").html('Su mail ha sido enviado con éxito');	//borra los mensajes anteriores
						$("#frmconsulta")[0].reset();							//reseteamos el form
					}else{
						$("#msg").html(datos);									//envío el mensaje de error
					}
					$("#esperando").css("visibility", "hidden");				//desaparece esperando....	
					},
				error: function(request,error) {
					$("#esperando").css("visibility","hidden");
					$('#msg').html("<span style='color:#ff0000;'> " + error + "</span>");  
				}
			});  //fin AJAX
			return false;
		});  // FIN click
	});	//fin document				
</script>

2) FORM en HTML

<div style="margin: 0 auto; margin-left:40px; background-color:#FFF;">
	<form  method="post" action="" name="frmconsulta" id="frmconsulta" style="margin-top:10px; margin-left:5px; border-bottom: #ccc solid 1px;">
		<ul class="contacto">
			<li>
				<span>Nombre:</span>
				<span class="err" id="msgnombre">¡Obligatorio!</span><br/>
				<span>
					<input class="consulta" name="txtNombre" type="text" id="txtNombre" />
				</span>
			</li>
			<li>
				<span>Email:</span>
				<span class="err" id="msgemail">¡Email Inválido!</span><br>
				<span>
					<input class="consulta" name="txtEmail" type="text" id="txtEmail" />
				</span>
			</li>
			<li>
				<span>Tel:</span>
				<span class="err" id="msgtel">¡Obligatorio!</span><br>
				<span>
					<input class="consulta" name="txtTel" type="text" id="txtTel"  />
				</span>
			</li>
			<li style="margin-top:5px;" >
				<span>Mensaje:</span>
				<span><span class="err" id="msgcomentario">¡No envía!</span><br>
				<span>
					<textarea class="mensaje" name="txtCom" ols="35" rows="4" id="TxtCom"></textarea>
				</span>
			</li>
		</ul>
		<div style="margin-top:10px; margin-left:5px;">
				<input type="Button" id="enviar" value="ENVIAR" style="margin-left:10px;" />
				<img id="esperando" src="esperando.gif" width="16" height="16" style="visibility:hidden;" />
			<span id="msg" style="margin-left:10px;"> </span>
		</div>
	</form>
</div>



3) Script PHP para enviar el mail

<?
$cuerpo = "Formulario de consulta enviado desde xxx.com.ar<br><br>"; 
$cuerpo .= "Nombre: " . $_POST["txtNombre"] . "<br>";
$cuerpo .= "Teléfono: " . $_POST["txtTel"] . "<br>";
$cuerpo .= "Email: " . $_POST["txtEmail"] . "<br>"; 
$cuerpo .= "Consulta: " . $_POST["txtCom"] . "<br>";
require 'PHPMailerAutoload.php';
$mail = new PHPMailer();					// inicializo Mailer
$mail->IsSMTP();							//setea para smtp
$mail->SMTPAuth = true;					// activa la autenticacion smtp
$mail->Host = "mail.xxx.com.ar";			// setea el servidor smtp
$mail->Port = 25;						// setea el puerto 25
$mail->Username = "envios@xxx.com.ar";
$mail->Password = "tupassword";

// parametrizo mi mail
 $mail->SetFrom('envios@xxx.com.ar', 'XXX');						// primero mail luego alias
 $mail->AddAddress('webmaster@xxx.com.ar', 'CARLOS');
	//$mail->addAddress('joe@example.net', 'Joe User');			// Agregar destinatarios
	//$mail->addAddress('ellen@example.com');					// El nombre es opcional
	//$mail->addReplyTo('info@example.com', 'Information');
	//$mail->addCC('cc@example.com');							//agrega copia 
	//$mail->addBCC('soporte@iqsystems.com.ar', 'SOPORTE');		//agrega copia oculta
	//$mail->addAttachment('/var/tmp/file.tar.gz');				// Agrega adjuntos
	//$mail->addAttachment('/tmp/image.jpg', 'new.jpg');			// el nombre es opcional
	//$mail->AltBody = 'opcional cuerpo en texto llano sin HTML';
$mail->isHTML(true);								// setea HTML
$mail->Subject ="Aca pongo el asunto";    
$mail->Body = $cuerpo;
try {
	//$mail->send();
	echo "Exito";
} catch (Exception $e) {
	echo "Mailer Error: " . $mail->ErrorInfo;
}
?>

						
					
© IQSystems 2023