I'm wanting to put together a form for a site using PHPMAILER. I'm trying to do tests with my own Email but I'm not getting the messages coming to me nor are the verification fields working for me.
This is the test site . On the other hand I'm not working validation of the input, maybe I have wrongly associated the JS file with PHP and if in the FORM should only put the value with their names.
The idea is that once the form is sent, a message of thanks will appear and we will get in touch!
The weapon I was doing is the following:
$("#btnSubmit").on("click", function(e){
var errorMessage = $(".errorMessage");
var validMessage = $(".validMessage");
var hasError = false;
var hasvalid = true;
$(".inputValidation").each(function(){
var $this = $(this);
if($this.val() == ""){
hasError = true;
$this.addClass("inputError");
errorMessage.html("<p>Por favor, complete los siguientes campos.</p>");
e.preventDefault();
}if($this.val() != ""){
$this.removeClass("inputError");
}else{
return true; alert(1);
}
}); //Input
validMessage.slideDown(700);
$(".inputValidation").each(function(){
var $this = $(this);
if($this.val() == ""){
hasvalid = false;
$this.addClass("inputError");
validMessage.html("<p>Por favor, complete los siguientes campos.</p>");
e.preventDefault();
}if($this.val() != ""){
$this.removeClass("inputError");
}else{
return true; alert(1);
}
}); //Input
validMessage.slideDown(700);
/*ajax*/
if(hasError == false){
Ecommerce = document.getElementById("exampleInputEcommerce").value;
Nombre = document.getElementById("exampleInputNombre").value;
Telefono = document.getElementById("exampleInputPhone").value;
Email = document.getElementById("exampleInputEmail1").value;
data2= {
ecommerce:Ecommerce,
nombre:Nombre,
telefono:Telefono,
email:Email,
tarea: "envio"
};
$.ajax({
type: "POST",
url:"envio.php",
data: data2,
success:function(data){
console.log("entro");
/*$('#respuesta').fadeOut('fast').html(
"Gracias, se a enviado su mensaje"
);*/
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
$('.validMessage').fadeOut('fast').html(
"Gracias, se a enviado su mensaje"
);
$(".inputValidation").val("");
}
});
}
}); //Form .submit.inputError{
background-color: #9e46578c!important;
border-bottom: 2px solid #824747!important;
color: #fff;
}
.inputError::-webkit-input-placeholder{
color: #fff;
}
.errorMessage{
/*background-color: #d03e3e; */
color: #fff;
clear: right;
display: none;
font-size: 14px;
font-weight: bold;
height: 55px;
letter-spacing: 1px;
-moz-border-radius: 0px 0px 3px 3px;
-webkit-border-radius: 0px 0px 3px 3px;
border-radius: 0px 0px 3px 3px;
margin-top: 21px;
}
.errorMessage p{
margin: 0px;
padding: 19px 0px 0px 30px;
text-align: left;
}<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp" crossorigin="anonymous">
<form class="formValidation px-lg-2">
<div class="form-group">
<input type="name" value="ecommerce" class="form-control inputValidation" id="exampleInputEcommerce" aria-describedby="ecommerce" placeholder="Ecommerce">
</div>
<div class="form-group">
<input type="name" value="nombre" class="form-control inputValidation" id="exampleInputNombre" aria-describedby="nombre" placeholder="Nombre">
</div>
<div class="form-group">
<input type="phone" value="telefono" class="form-control inputValidation" id="exampleInputPhone" aria-describedby="phone" placeholder="Teléfono">
</div>
<div class="form-group mb-5">
<input type="email" value="email" class="form-control inputValidation" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Email">
</div>
<button type="submit" class="btn btn_enviar_form mt-sm-5">ENVIAR</button>
</form>
<div class="errorMessage"></div>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script> <?php
function envioMail(){
$ecommerce = $_POST["ecommerce"];
$nombre = $_POST["nombre"];
$telefono = $_POST["telefono"];
$email = $_POST["email"];
require("class.phpmailer.php");
$mail = new PHPMailer();
$mail->Mailer = "smtp";
$mail->SMTPAuth = true;
$mail->Host = "[email protected]"; // A RELLENAR. Aquí pondremos el SMTP a utilizar. Por ej. mail.midominio.com
$mail->Username = "[email protected]"; // A RELLENAR. Email de la cuenta de correo. [email protected] La cuenta de correo debe ser creada previamente.
$mail->Password = ""; // A RELLENAR. Aqui pondremos la contraseña de la cuenta de correo
$mail->From = "[email protected]"; // A RELLENAR Desde donde enviamos (Para mostrar). Puede ser el mismo que el email creado previamente.
$mail->FromName = "Mariano"; //A RELLENAR Nombre a mostrar del remitente.
$mail->Subject = "Mensaje de Welivery"; // Este es el titulo del email.
$mail->AddAddress("[email protected]");/*email de CM*/
$body =
"
Se ha informado la descarga del siguiente resultado: $codigoAlerta
Muchas gracias
Equipo PfAst
Pfizer
";
$mail->Body = $body;
$mail->CharSet = 'UTF-8';
$mail->Send();
}
if($_POST){
switch($_POST["tarea"]){
case "envio":envioMail();break;
}
}
?>