So zeigen Sie eine Erfolgs-/Fehlermeldung im Kontaktformular an senden

Question

Ich versuche eine einfache Methode zu finden, um zu zeigen, dass eine Nachricht in einem Kontaktformular gesendet wurde oder nicht. Im Moment wird bei Erfolg oder Misserfolg auf eine designierte Erfolgs- oder Fehlerseite umgeleitet. Alles, was ich tun möchte, ist statt Redirect, vielleicht zeigen Sie ein Div, oder Modal oder Popup, aber ich bin mir nicht sicher, wie man das in PHP macht.

Form:

<div class="col-lg-7 col-sm-7 contactboxform"> 
    <form action="contact_me.php" method="POST" id="contactform"> 
     <input type="text" name="name" placeholder="Name..." class="input-text"> 
     <input type="text" name="phone" placeholder="Phone Number..." class="input-text"> 
     <input type="email" name="email" placeholder="E-mail Address..." class="input-text"> 
     <input type="checkbox" name="interested"> 
     <textarea name="message" placeholder="What would you like to say?" class="input-text text-area" rows="7"></textarea> 
     <button type="submit" id="subbtn" class="btn btn-default btn-lg">Submit</button> 
    </form> 
    </div> 

PHP:

// send email 
if (!empty($name) && !empty($email) && !empty($phone) && !empty($message)) { 
    $success = mail($emailTo, $subject, $body, "From: <$emailFrom>"); 
} 
if ($success){ 
    header('Location: success.html'); 
} 
else { 
    header('Location: failed.html'); 
} 
//redirect to success page 

Also ich bin nur nicht sicher, wie man richtig in PHP zu sagen, die auf Erfolg, spezifische div/Pop-up zeigen.

Vielen Dank im Voraus

Answer 1

Sie können versuchen, ein div erstellen und dann in ihn aus einem AJAX-Request eine Antwort einfügen.

Zum Beispiel, fügen Sie zu Ihrem HTML-Code:

<div id="form_status"></div> 

Wenn die Submit-Button geklickt wird, können Sie die AJAX-Request durchführen:

<button type="submit" id="subbtn" class="btn btn-default btn-lg" onClick="validateForm();">Submit</button> 

Und die validateForm Funktion sein kann:

function validateForm() 
{ 
    var status = $('div#form_status'); 
    var form = $('form#contactform'); 
    $.ajax({ 
     url: 'your-php-file.php?'+form.serialize() 
    }).done(function(data){ 
     status.html(data); 
    }); 
} 

Unter your-php-file.php können Sie auf alle Daten aus dem Formular wi zugreifen th $_GET['input_name'], wobei input_name die name der Eingabe auf dem Formular ist.

Mit diesem wird alles, was Sie auf der your-php-file.php drucken in die div#form_status gedruckt werden, ohne die Seite neu zu aktualisieren.