Galera não tenho muita experiência com o PHP,
fiz um envio de formulário só com o phpmailer e funcionou corretamente. Porém eu criei uma mensagem personalizada para dizer ao usuário se o e-mail foi encaminhado com sucesso ou não, então me informaram que eu deveria utilizar o Ajax com o PHPmailer fazendo um POST.
Até ai tudo bem, o modal que eu utilizo é do Framework chamado Materialize.
Porém antes o meu código estava dando erro page not found (404) e eu não sei o porque, agora ele não da erro, não envia o e-mail e não mostra a mensagem no modal, poderiam me ajudar por gentileza?
Hierarquia das pastas na minha máquina:
/home/thiagosaad/Downloads/flicka/js/flk/rules.js <-- AJAX
/home/thiagosaad/Downloads/flicka/php/sendEmail.php <-- PHPMailer
Hierarquia no LAMPP
http://localhost/flicka/js/flk/rules.js
http://localhost/flicka/php/sendEmail.php
AJAX
var mensagemRecebidaForm = document.getElementById('http-message');
/*
* Esta função envia o Formulário para o E-mail através do PHPMailer
* SE a mensagem for enviada com sucesso : O icon é alterado para a cor verde & a Mensagem é alterado para "Mensagem Enviada !"
* SENÃO SE ocorrer algum erro no envio da mensagem : O icon é alterado para a cor vermelha & a Mensagem é alterado para "OPS... ALGO DEU ERRADO !"
*/
function sendForm(){
// Armazenando informações do formulário em variáveis
var nome = $("#formNome").val();
var sobrenome = $("#formSobrenome").val();
var empresa = $("#formEmpresa").val();
var telefone = $("#formTelefone").val();
var celular = $("#formCelular").val();
var email = $("#formEmail").val();
var mensagem = $("#formMensagem").val();
var urlData = "&formNome=" + nome + "&formSobrenome=" + sobrenome + "&formEmpresa=" + empresa + "&formTelefone" + telefone + "&formCelular" + celular + "&formEmail" + email + "&formMsg=" + mensagem;
$.ajax({
url: "php/sendEmail.php",
type: "POST",
data: urlData,
sucess: function(data){
mensagemRecebidaForm.innerHTML =
'<i class="fa fa-paper-plane large green-text" aria-hidden="true"></i>' +
'<p class="flow-text"><h5 class="request-response-message-txt black-text">'+ "YUPII, MENSAGEM ENVIADA !" +'</h5></p>';
},
error:function(data,error){
mensagemRecebidaForm.innerHTML =
'<i class="fa fa-paper-plane large red-text" aria-hidden="true"></i>' +
'<p class="flow-text"><h5 class="request-response-message-txt black-text">'+ "OPS... ALGO DEU ERRADO !" +'</h5></p>';
console.log("DATA: ",data + "ERROR: ",error);
}
});
}
PHPmailer
<?php
require_once __DIR__ . '/phpmailer/class/PHPMailer.php';
require_once __DIR__ . '/phpmailer/class/SMTP.php';
require_once __DIR__ . '/phpmailer/class/Exception.php';
// Inicia a Classe PHPMailer
$mailer = new PHPMailer\PHPMailer\PHPMailer(true);
try{
// Recebe as Variáveis
$formNome = $_POST["formNome"];
$formSobrenome = $_POST["formSobrenome"];
$formEmpresa = $_POST["formEmpresa"];
$formTelefone = $_POST["formTelefone"];
$formCelular = $_POST["formCelular"];
$formEmail = $_POST["formEmail"];
$formMensagem = $_POST["formMensagem"];
// Define: Dados do Servidor & Tipo de Conexão
$mailer->IsSMTP();
$mailer->SMTPAuth = true;
$mailer->SMTPSecure = 'ssl';
$mailer->Host = 'smtp.gmail.com';
$mailer->Port = 465; // Porta de Entrada/Saida SSL do GMAIL
$mailer->Username = 'thiagodbonis@gmail.com';
$mailer->Password = '****';
// Define: O formato do E-mail
$mailer->IsHTML(true);
// Define: Remetende do E-mail
$mailer->setFrom("$formEmail", "$formNome");
// Define: Destinatário do E-mail
$mailer->addAddress("$mailer->Username", "FLICKA MARKETING");
//$mailer->AddCC('email@seuemail.com.br', 'Eu'); - Email em Copia p/ outro Email
$mailer->Subject = 'FORMULÁRIO FLICKA MARKETING';
$mailer->Body = nl2br("NOME: " . $formNome . " " . $formSobrenome . "\nEMPRESA: " . $formEmpresa . "\nTELEFONE: " . $formTelefone . "\nCELULAR: " . $formCelular . "\nE-MAIL: " . $formEmail . "\n\n MENSAGEM: " . $formMensagem);
// Enviar o E-mail & Exibirá uma mensagem de Resultado
$mailer->Send();
}catch (Exception $e){
//echo 'Error: ' . $mailer->ErrorInfo;
}
?>
Formulário
<form id="contactForm" name="contactForm" action="php/sendEmail.php" method="POST"> <!-- FORMULÁRIO DE CONTATO -->
<div class="input-field col s12 m6 l6 xl6"> <!-- NOME -->
<i class="fa fa-user-circle prefix" aria-hidden="true"></i>
<input id="formNome" name="formNome" class="validate" type="text" required>
<label for="formNome" class="white-text" data-error="Ops... Algo deu Errado." data-success="Sucesso"><span class="label-text-nome">Nome</span></label>
</div>
<div class="input-field col s6 l6 xl6 hide-on-small-only"> <!-- SOBRENOME -->
<input id="formSobrenome" name="formSobrenome" class="validate" type="text" required>
<label for="formSobrenome" class="white-text" data-error="Ops... Algo deu Errado." data-success="Sucesso"><span class="label-text-sobrenome">Sobrenome</span></label>
</div>
<div class="input-field col s12 m12 l12 xl12"> <!-- EMPRESA -->
<i class="fa fa-building-o prefix" aria-hidden="true"></i>
<input id="formEmpresa" name="formEmpresa" class="validate" type="text" required>
<label for="formEmpresa" class="white-text" data-error="Ops... Algo deu Errado." data-success="Sucesso"><span class="label-text-empresa">Empresa</span></label>
</div>
<div class="input-field col s12 m6 l6 xl6">
<i class="fa fa-phone prefix" aria-hidden="true"></i> <!-- TELEFONE -->
<input id="formTelefone" name="formTelefone" class="validate" type="tel" required>
<label for="formTelefone" class="white-text" data-error="Ops... Algo deu Errado." data-success="Sucesso"><span class="label-text-telefone">Telefone</span></label>
</div>
<div class="input-field col s6 l6 xl6 hide-on-small-only"> <!-- CELULAR -->
<i class="fa fa-mobile prefix" aria-hidden="true"></i>
<input id="formCelular" name="formCelular" class="validate" type="tel" required>
<label for="formCelular" class="white-text" data-error="Ops... Algo deu Errado." data-success="Sucesso"><span class="label-text-celular">Celular</span></label>
</div>
<div class="input-field col s12 m12 l12 xl12"> <!-- E-MAIL -->
<i class="fa fa-envelope-o prefix" aria-hidden="true"></i>
<input id="formEmail" name="formEmail" class="validate" type="email" required>
<label for="formEmail" class="white-text" data-error="Ops... Algo deu Errado." data-success="Sucesso"><span class="label-text-email">Email</span></label>
</div>
<div class="input-field col s12 m12 l12 xl12"> <!-- MENSAGEM -->
<i class="fa fa-commenting-o prefix" aria-hidden="true"></i>
<textarea id="formMensagem" name="formMensagem" class="materialize-textarea" data-length="400"></textarea>
<label for="formMensagem" class="white-text"><span class="label-text-mensagem">Mensagem</span></label>
</div>
<div class="col s12 m12 l12 xl12"> <!-- BOTÃO ENVIAR FORM -->
<button id="btn-enviar-mensagem" data-target="request-response-http-message" class="modal-trigger waves-effect waves-white btn-large z-depth-5 black" onclick="sendForm()" type="submit" value="Send"><a class="white-text">ENVIAR</a></button>
<!-- Modal Trigger -->
<!--<a class="waves-effect waves-light btn modal-trigger" href="#request-response-http-message">Modal</a>-->
</div>
</form> <!-- FIM FORMULÁRIO DE CONTATO -->