如何在将PHP表单提交到同一页面之前清空页面？

Question

I'm trying to create an auto-response script for work which will display the form fields as required, such as Name , Username , and Password . Once I select Submit, I want the script to remove the form, and display the output with the corresponding response in its stead without having to post it to another page. Ultimately having a form.php and a result.php for each individual scenario that I want will be too cluttered, hence why I'm trying to accomplish this. Thus far for the form, I have:

<form action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post">
    <table width="100%" cellpadding="10" cellspacing="0">
        <tr>
            <td style="width:33%">

            </td>
            <td style="width:33%">&nbsp;</td>
            <td style="width:33%">&nbsp;</td>
        </tr>
        <tr>
            <td colspan="3" style="width:99%">
                <label>Name</label><span class="req">*</span>
                <span id="reqName" style="color:Red;display:none;">&nbsp;</span>
                <br />
                <input type="text" name="name">
            </td>
        </tr>
        <tr>
            <td colspan="3" style="width:99%">
                <label>Username</label><span class="req">*</span>
                <span id="reqProblem" style="color:Red;display:none;">&nbsp;</span>
                <br />
                <input type="text" name="username">
            </td>
        </tr>
        <tr>
            <td colspan="3" style="width:99%">
                <label for="txtProblem">Password</label><span class="req">*</span>
                <span id="reqProblem" style="color:Red;display:none;">&nbsp;</span>
                <br />
                <input type="text" name="password">
            </td>
        </tr>
        <tr>
            <td colspan="3" style="width:99%">
            <br />
            <input type="submit" name="submit" value="Submit">
            </td>
        </tr>
    </table>
</form>

For the PHP I have:

<?php
if(isset($_POST['submit'])) {
    echo "<h4>Response</h4>";
    $username = $_POST['username'];
    $password = $_POST['password'];
    $name = $_POST['name'];

    echo "<p>Hello, $name <br />


    Your Login Information is as follows:
    Username: $username
    Password: $password.
</p>";
}
?>

So to sum up, I want to completely remove everything before the PHP isset and replace it with the corresponding result.

Answer 1

In the present form what happens is that your HTML is sent off to the browser (or at least some invisible buffer on its way to the browser) and is out of your control once you've gotten to the part of your script that controls form processing.

So you've got two choices. One is to leave it generally in the state you have it but use output buffering with ob_start() and related functions - which I really don't recommend in this case - or just re-arrange the order of your code.

In general the most common design pattern for these one-page self-processing forms is to have your processing logic at the very top, and the output of form or success/failure message be conditional on the results.

To implement this take your PHP code and move it to the top of the file. At the end of your present POST code, if the post was successful then you output your message but nothing else. If it isn't successful, or if there has not yet been any post, THEN you output the form html. Something along these lines:

<?php
if($no_post_or_failure)
{
// output html
?>
<form action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post">
...
<?php
} // aaaand we're done!
?>

And that's about it. I hope that made sense :)

Answer 2

Just change your PHP:

<?php
if(isset($_POST['submit'])) {
  echo "<h4>Response</h4>";
  $username = $_POST['username'];
  $password = $_POST['password'];
  $name = $_POST['name'];

  echo "<p>Hello, $name <br />
  Your Login Information is as follows:
  Username: $username
  Password: $password.
  <a href="yourPHPfileName.php">Back</a>
</p>";
}else{
?>
//YOUR HTML FORM GOES HERE
<?php 
}