提交PHP表单并刷新页面后，可以使用javaScript隐藏该表单吗？

Question

I have a form that is created in PHP and I've been doing the front end styling to it. When the form is submitted the page refreshes and a message is displayed. The message is displayed above the form - but the user shouldn't be able to interact with the form once it's submitted - or see it! Just see the confirmation message. I have no idea where to start with this or why this is happening. Can someone send me in the right direction?

Answer 1

If you want to do this server side, then you can simply do:

{% if (confirmed) %}`
    <p>Thank you. The form has been hidden</p>
{% else %}
    <form>
        <input type='text'>
    </form>
{% endif %}

Or, if you want to do this client side, then it is simple using jquery and you can hide the form by doing:

$("#form-id").hide()

Answer 2

Apply the "myForm" id to tag.

<form id="myForm">

Close the PHP tag one line before your message line printed in PHP, for example in case of contact form, like this.

//your ongoing code on click event of submit button
mail("mymail@gmail.com", $subject, $message, $headers, $email);
?>
<script>
$("#myForm").hide()
</script>
<?php 
echo "Message sent.";
?>

Another way to do it through CSS (Tested, Working!)

//your ongoing code on click event of submit button
mail("mymail@gmail.com", $subject, $message, $headers, $email);
?>
<style>
#myForm{display:none;}
</style>
<?php 
echo "Message sent.";
?>

Make sure to place this INSIDE THE CLICK function of the button. It should work!