Search code examples
phphtmlwordpressforms

How to show a success message after sending email?

I am trying to create a form to show in a wordpress site side bar. As a basic step I created the form without validation. The code is below.

<?php

if($_POST["submit"]) {
    $recipient="[email protected]";
    $subject="New reservations request";
    $sender=$_POST["sendername"];
    $senderEmail=$_POST["senderEmail"];
    $message=$_POST["message"];
    $name_title=$_POST["name_title"];   

    $mailBody="Name: $name_title $sender\nEmail: $senderEmail\n\n$message";

    mail($recipient, $subject, $mailBody, "From: $sender <$senderEmail>");

    $thankYou="<p>Thank you! Your message has been sent.</p>";
}

?>

<form id="" name="" action="<?php echo get_permalink(); ?>" method="post">
    <div class="form-note">We will contact you back within 24 hours with the availability and the estimated cost.</div>
    <br/>

    <div class="section-heading"><h6>Your Details</h6></div>
    <div class="label-input-wrapper">
        <div class="form-label">Title</div>
        <div class="form-input">
            <select name="name_title" class="name-title-input">
            <option value="" selected="selected">Select Title</option>
            <option value="Mr">Mr</option>
            <option value="Mrs">Mrs</option>
            <option value="Miss">Miss</option>
            <option value="4">Ms</option>
            <option value="5">Dr</option>
            <option value="6">Professor</option>
            <option value="7">The Rt Revd Dr</option>
            <option value="8">The Most Revd</option>
            <option value="9">The Rt Revd</option>
            <option value="10">The Revd Canon</option>
            <option value="11">The Revd</option>
            <option value="12">The Rt Revd Professor</option>
            <option value="13">The Ven</option>
            <option value="14">The Most Revd Dr</option>
            <option value="16">Rabbi</option>
            <option value="17">Canon</option>
            <option value="18">Dame</option>
            <option value="19">Chief</option>
            <option value="20">Sister</option>
            <option value="21">Reverend</option>
            <option value="22">Major</option>
            <option value="23">Other</option>
            <option value="24">Cllr</option>
            <option value="25">Sir</option>
            <option value="26">Rt Hon Lord</option>
            <option value="27">Rt Hon</option>
            <option value="28">The Lord </option>
            <option value="29">Viscount</option>
            <option value="30">Viscountess</option>
            <option value="31">Baroness</option>
            <option value="32">Captain</option>
            <option value="33">Master</option>
            <option value="34">Very Revd</option>
            <option value="35">Lady</option>
            <option value="38">MP</option>
            <option value="39">King of Kings and Lord of Lords</option>
            <option value="40">Conquering Lion of the Tribe of Judah</option>
            <option value="41">Elect of God and Light of this World</option>
            <option value="42">His Own Divine Majesty</option>
            <option value="43">First Ancient King of Creation</option>
            <option value="44">King Alpha</option>
            <option value="45">Queen Omega</option>
            <option value="46">Beginning with Our End and First with Our Last</option>
            <option value="47">Protector of All Human Faith</option>
            <option value="48">Ruler of the Universe</option>
            <option value="49">Dude</option>
            <option value="50">Mx (gender-netural)</option>
            </select>
        </div>
    </div>  

    <div class="label-input-wrapper">
        <div class="form-label">Name</div><div class="form-input"><input type="text" name="sendername"/></div>
    </div>

    <div class="label-input-wrapper">
        <div class="form-label">E-Mail</div><div class="form-input"><input type="email" name="senderEmail" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" required /></div>
    </div>  

    <div class="label-input-wrapper special">   
        <div class="form-label">Write us in details if you have any special requirement</div><div class="form-input">​<textarea name="message"></textarea></div>
    </div>  

    <input type="submit" value="Submit" name="submit">
</form>

Well it's sending to my email with those input values. Now I want to show a success message after the form submitted and the form should disappear. I tried several code samples those I get by googling but I could not implement those into my code. How can I do that?

[EDITED AFTER first reply] thanks for that. but it says syntax error. 

<?PHP
if($_POST["submit"]) {
    $recipient="[email protected]";
    $subject="Arugambay Bookings : New reservations request";
    $sender=$_POST["sendername"];
    $senderEmail=$_POST["senderEmail"];
    $message=$_POST["message"]; 

    $mailBody="Name: $sender\nEmail: $senderEmail\n\n$message";

$mail_sent = mail($recipient, $subject, $mailBody, "From: $sender <$senderEmail>");

if ($mail_sent) {
?>

  <p>Mail sent</p>

<?php 
} else {
?>


<form id="" name="" action="<?php echo get_permalink(); ?>" method="post">
    <div class="form-note">We will contact you back within 24 hours with the availability and the estimated cost.</div>
    <br/>
    <div class="section-heading"><h6>Your Details</h6></div>

    <div class="label-input-wrapper">
        <div class="form-label">Name</div><div class="form-input"><input type="text" name="sendername"/></div>
    </div>

    <div class="label-input-wrapper">
        <div class="form-label">E-Mail</div><div class="form-input"><input type="email" name="senderEmail" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" required /></div>
    </div>  

    <div class="label-input-wrapper special">   
        <div class="form-label">Write us in details if you have any special requirement</div><div class="form-input">​<textarea name="message"></textarea></div>
    </div>  

    <input type="submit" value="Submit" name="submit">
</form>

<?php
}
?>
Solution

  • mail will return true on success, and false otherwise, just check this value to know which HTML part you want to dispaly 

    $mail_sent = mail(...);

if ($mail_sent) {
?>

  <p>Mail sent</p>

<?php 
} else {
?>

  <form>
  ...

<?php
}
?>