PHP Mensagem de Sucesso do formulário de email

Beorlegui · 3 de outubro de 2018

Tenho um formulário que está funcionando perfeitamente.

Só que o meu problema é que assim que aparece a mensagem de "enviado com sucesso", a página recarrega e quando recarrega, some todo o estilo dela.
Tem alguma forma de fazer a página aparecer a mensagem, mas sem recarregar?
Me deram a dica de tentar com Ajax e JavaScript, mas não entendo nada de Ajax e JavaScript estou iniciando ainda.
Alguém poderia me dar uma ajuda, por favor?

Vou deixar o código do PHP abaixo:

<html>
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Enviando email por um formulário </title>
</head>


<?

    $nome = $_POST[nome];
    $email = $_POST[email];
    $subject = "Passeio Pet - Contato";
    $mensagem = nl2br($_POST[mensagem]);
    $meu_email = $_POST[meu_email];
    $cpf = $_POST[v_cpf];
    $rg = $_POST[v_rg];
    $cpf = $_POST[v_cpf];
    $opcao = $_POST[opcao];
    $telefone = $_POST[telefone];
    $assunto = $_POST[assunto];
    $nomedaempresa = $_POST[nomedaempresa];

    $mensagemx = ("Nome: $nome \n

    Email: $email \n

    Assunto: $assunto \n

    mensagem: $mensagem \n
     $rg \n
     $cpf \n
     $telefone \n
     $nomedaempresa \n
     $opcao");


    $recipiente = $meu_email;

    $headers = "MIME-Version: 1.0 ";
    $headers .= "Content-Type: text/html; charset=utf-8\n";
    $headers .= "From: $email ";
   

    if(mail($recipiente, $subject, $mensagemx, $headers)){
        echo '
    <script>
        alert("Mensagem enviada com sucesso!");
        window.location.href = "marciaprates.space/public_html/Rhaissa - Pet Clube/index.html";
    </script>';

    }else{
        echo "Erro!!!";  }

 ?>

</html>

fredkissfree · 3 de outubro de 2018

@Beorlegui Opa, primeira coisa, tenta usar o PHPMailer para poder enviar, eu usei a versão 5.2 que é estável e não precisa do composer e funcionou melhor que o mail(). O mail da muito problema de spam.

Amanhã vou dar uma olhada que hoje não vai dar tempo, mas já fiz isso de não sair da página e acho que não usei JS...

Beorlegui · 3 de outubro de 2018

Eu tentei usar o PHPMailer, mas não consegui fazer enviar. Nao sei se foi a configuração que coloquei errada, mas tentei de todo jeito e não deu certo, eu uso a hospedagem pelo Hostinger.

Já dessa forma aí eu consegui enviar. Não tenho problema com Spam.
Mas se puder me ajudar eu agradeço

adicionado 1 minuto depois

@fredkissfree

Eu tentei usar o PHPMailer, mas não consegui fazer enviar. Nao sei se foi a configuração que coloquei errada, mas tentei de todo jeito e não deu certo, eu uso a hospedagem pelo Hostinger.

Já dessa forma aí eu consegui enviar. Não tenho problema com Spam.
Mas se puder me ajudar eu agradeço

fredkissfree · 3 de outubro de 2018

Vou ajudar sim, começo desta semana eu estava igual a você usando mail e nunca tinha mexido em phpmailer... vi tanta aula que já to fera hahahaa

Também uso Hostinger...

DiF · 3 de outubro de 2018

@Beorlegui @fredkissfree Para fazer um envio de e-mail sem atualizar a página realmente precisa do ajax.

Nada melhor do que usar o jQuery e a função $.ajax() para isso.

Sugiro fazerem uma busca pelo setor de web pois existem centenas de tópicos sobre como usar o ajax

Beorlegui · 5 de outubro de 2018

@fredkissfree Vou ficar no aguardo.

Obrigada.

adicionado 0 minutos depois

@DiF Ainda não sei mexer com Ajax.

DiF · 5 de outubro de 2018

@Beorlegui Sem problemas, nada que uma tarde lendo a api do jquery e exemplos para aprender.

Mas como mencionei, o único jeito do que você quer fazer é com ajax. É o único jeito.

Vou dar um exemplo bem simples de uso. Com isso você pode implementar algo melhor.

Primeiro, para usar o jquery você precisa importar ele ao seu index.

Tem de dois jeitos: baixar o arquivo e linka-lo ou usar o CDN. O CDN é mais fácil porque é só colocar esta linha dentro do <head> :

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Com isso você já pode escrever em jQuery.

A função que você precisa é $.ajax(). então considere este formulário exemplo:

<form  id="contato" action="#">
  <input type="text" name="nome" />
  <input type="text" name="email" />
  <input type="submit" class="btn-submit" value="Enviar" />
</form>

Repare que não coloquei um action. Porque faremos via jQuery.

Vamos supor que o arquivo contato.php é o responsável por receber os dados do formulário e enviar o e-mail.

Para enviar os dados para esta página usaremos a função $.ajax() dentro da função de click no botão de enviar desta forma:

$(document).ready(function(){
    $(".btn-submit").on("click", function(){
          //cria uma serialização com os dados do formulário
          var dados = $("#contato").serialize();
      
           $.ajax({
               url: "contato.php",
               data: dados,
               dataType: "HTML",
               method: "POST"
           }).done(function(retorno){
                //aqui mostrará o retorno se bem sucedido
                alert(retorno); 
           }).fail(function(retorno){
               //aqui mostrará o retorno se mal sucedido
               alert(retorno);
           });
    
    });
});

Agora como você vai receber os dados nesta página contato.php?

<?php
   /*estas variáveis recebe os dados que vieram serializados. */

   $nome  = $_POST["nome"];
   $email = $_POST["email"];


   //aqui você pode usar estes dois dados com o phpmailer

Não coloco um exemplo do phpmailer, porque aqui no fórum já tem centenas de tópicos sobre ele.

Mas o recebimento dos dados é basicamente aquilo ali.

Uma coisa que não deixei de notar no seu post anterior é que todas as suas variáveis $_POST que você recebe, não usou a aspas. Você precisa usa-las desta forma:

$nome          = $_POST["nome"];
$email         = $_POST[email];
$subject       = "Passeio Pet - Contato";
$mensagem      = nl2br($_POST["mensagem"]);
$meu_email     = $_POST["meu_email]";
$cpf           = $_POST["v_cpf"];
$rg            = $_POST["v_rg"];
$cpf           = $_POST["v_cpf"];
$opcao         = $_POST["opcao"];
$telefone      = $_POST["telefone"];
$assunto       = $_POST["assunto"];
$nomedaempresa = $_POST["nomedaempresa"];