通过电子邮件发送表单详细信息的最佳方法是什么？

Question

Newbie seeking advice, will be much appreciated if someone can help me out!!!

So I have a simple form on my site:

<form id="quote" method="post" class="contact" action="mail.php">
                <fieldset>
                    <div id="form_name">
                        <label for="name" class="fixedwidth"> Please enter your full name:</label>
                        <input id="name" name="name" type="text" required aria-required="true" autofocus>
                    </div>

                    <div id="form_mail">
                        <label for="email" class="fixedwidth"> Please enter your email address:</label>
                        <input id="email" name="email" type="email" required aria-required="true">
                    </div>

                    <div id="form_tel">
                        <label for="tel" class="fixedwidth">Please enter you phone number:</label>
                        <input id="tel" name="tel" type="tel" required aria-required="true" >
                    </div>                      

                    <div id="form_message">
                        <label for="message" class="fixedwidth"> Leave a message:</label>
                        <textarea id="message" name="message" cols="20"rows="7"></textarea>
                    </div>

                    <div id="form_submit">
                    <input type="submit" value="Submit">
                    </div>

I want to email the details onto myself. I'm using mail.php for this:

<?php

$myemail = "myemail@gmail.com";

$name = $_POST['name'];
$email = $_POST['email'];
$tel = $_POST['tel'];
$message = $_POST['message'];
$subject = 'Website query';


$body = "Name: $name E-mail: $email Telephone Number: $tel Subject: $subject Message: $message";

mail($myemail, $subject, $body);
?>

When a user hits the "submit" button, I want a thank you response to appear below the form and the form to be cleared.

Can anyone help me out with this?

Thanks a million!

Answer 1

You actually do not need javascript to do this, just put everything on the same page and check if POST values are sent.

    <form id="quote" method="post" class="contact" action="">
                    <fieldset>
                        <div id="form_name">
                            <label for="name" class="fixedwidth"> Please enter your full name:</label>
                            <input id="name" name="name" type="text" required aria-required="true" autofocus>
                        </div>

                        <div id="form_mail">
                            <label for="email" class="fixedwidth"> Please enter your email address:</label>
                            <input id="email" name="email" type="email" required aria-required="true">
                        </div>

                        <div id="form_tel">
                            <label for="tel" class="fixedwidth">Please enter you phone number:</label>
                            <input id="tel" name="tel" type="tel" required aria-required="true" >
                        </div>                      

                        <div id="form_message">
                            <label for="message" class="fixedwidth"> Leave a message:</label>
                            <textarea id="message" name="message" cols="20"rows="7"></textarea>
                        </div>

                        <div id="form_submit">
                        <input type="submit" value="Submit">
                        </div>
     </fieldset>
</form>
<?php if(isset($_POST['email'])) { // & other checks

   $myemail = "myemail@gmail.com";

   $name = $_POST['name'];
   $email = $_POST['email'];
   $tel = $_POST['tel'];
   $message = $_POST['message'];
   $subject = 'Website query';


   $body = "Name: $name E-mail: $email Telephone Number: $tel Subject: $subject Message: $message";

   if(mail($myemail, $subject, $body)){
     echo "MAIL SENT";
   }
} ?>

Just add value="" to your inputs to clear them on reload. On the other hand if you do not want the page to reload at all you will need javascript with AJAX

NB: I haven't checked your code for errors I'm just giving you the logic but at first glance it seems ok.