Hide form after submit with php / html


I know there are some very similar questions around here but since I am not that deep into javascript / ajax etc. yet, I couldn't solve my problem with the answers I found there.

I have a contact form on a website that I want to hide on submit.

My HTML is:

And my PHP file is

    $mailTo = "[email protected]";
    $subject = "Contact Request";
    $body = "You've got mail
FROM: ".$_POST['email']."<br>
NAME: ".$_POST['author']."<br>
COMMENTS: ".$_POST['message']."<br>";   
    $headers = "To: Me <".$mailTo.">\r\n";
    $headers .= "From: ".$_POST['author']." <".$_POST['email'].">\r\n";
    $headers .= "Content-Type: text/html";
    $mail_success =  mail($mailTo, utf8_decode($subject), utf8_decode($body), $headers);        


Could anyone please tell me the easiest way to hide the form after someone has submitted? I don't know much about java or jquery yet, so a basic or step by step answer would be appreciated. :)


EDIT: The contact form is on the same page where I want to hide it. There is no other page, it's just the one.




If you are using jQuery you can add this JavaScript code in the end of your HTML:

   $(function () {
        $('#contact').on('submit', function (e) {
            var self = this; //Keep a reference to the form that was submitted
                url: $(this).attr('action'), 
                method: $(this).attr('method'),
                data: $(this).serialize(),
                success: function () {
                     $(self).hide(); //Hide the form if the request was successful 
                error: function () { alert('Failed to send email'); }


This should submit the form via ajax and not refresh the page when that happens.




If you have jQuery in your project, just make a


after the submit action.




You don't really need JavaScript for this.

Since you mention that the PHP for dealing with the form submit is on the same page as the HTML, you can simply tell the code not to render the form when the form was posted back, by wrapping the form inside a PHPif statement, something like this:

  <form method="post" id="contact" class="peThemeContactForm form" action="mail.php">
  <!-- (and all the rest of your form code...) -->

P.S. You could also consider adding anelse in which you print something else such as a "Thanks" or other kind of confirmation message.

People are also looking for solutions to the problem: WordPress: Getting title tag in PHP variable


Didn't find the answer?

Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.

Ask a Question

Write quick answer

Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.

Similar questions

Find the answer in similar questions on our website.