PHP:如何在提交后清除表单并显示成功提示？

Question

我一直在用PHP (php的新手)在成功提交后清除表单字段时遇到麻烦。我还想显示一个警报，它是成功的。有什么想法吗？将javascript与用于提交按钮的onclick侦听器一起使用将不起作用，因为它会在PHP有时间发送数据之前清除字段。

下面是我的html：

<div class="col-lg-7 mt-5 mt-lg-0 d-flex align-items-strech" data-aos="fade-left">
  <form id="contact-form" action="contact-form-handler.php" method="post" role="form" class="php-email-form">
    <div class="form-row">
      <div class="form-group col-md-6">
        <label for="name">Name</label>
        <input type="text" name="name" class="form-control" id="name" data-rule="minlen:4" data-msg="Please enter at least 4 characters"/>
        <div class="validate"></div>
      </div>
      <div class="form-group col-md-6">
        <label for="name">Email</label>
        <input type="email" name="email" class="form-control" id="email" data-rule="email" data-msg="Please enter at valid email"/>
        <div class="validate"></div>
      </div>
    </div>
    <div class="form-group">
      <label for="name">Subject</label>
      <input type="text" class="form-control" name="subject" id="subject" data-rule="minlen:4" data-msg="Please enter a subject of at least 8 characters"/>
      <div class="validate"></div>
    </div>
    <div class="form-group">
      <label for="message">Message</label>
      <textarea class="form-control" name="message" rows="10" data-rule="required" data-msg="Please enter a message"></textarea>
      <div class="validate"></div>
    </div>
    <div class="text-center"><button type="submit">Send Message</button></div>
  </form>
</div>

这是我的PHP：

<?php
  $name = $_POST['name'];
  $visitor_email = $_POST['email'];
  $subject = $_POST['subject'];
  $message = $_POST['message'];


  $email_from = "Portfolio Email";
  $email_body = "Name: $name.\n".
                "User Email: $visitor_email.\n".
                "User Message: $message.\n";

  $email_to = "email@gmail.com";

  $headers = "From: $email_from \r\n";

  mail($email_to, $subject, $email_body);
?>

Answer 1

如果你不想使用ajax，请尝试下面的方法(假设网页名为"form.html"，php为“--form.html”)

php重定向到form.html将清除输入字段(这是web浏览器中的正常行为)，javascript将显示“成功”一词作为警告。

请根据您的需要进行进一步调整。

form.html

<div class="col-lg-7 mt-5 mt-lg-0 d-flex align-items-strech" data-aos="fade-left">
  <form id="contact-form" action="contact-form-handler.php" method="post" role="form" class="php-email-form">
    <div class="form-row">
      <div class="form-group col-md-6">
        <label for="name">Name</label>
        <input type="text" name="name" class="form-control" id="name" data-rule="minlen:4" data-msg="Please enter at least 4 characters"/>
        <div class="validate"></div>
      </div>
      <div class="form-group col-md-6">
        <label for="name">Email</label>
        <input type="email" name="email" class="form-control" id="email" data-rule="email" data-msg="Please enter at valid email"/>
        <div class="validate"></div>
      </div>
    </div>
    <div class="form-group">
      <label for="name">Subject</label>
      <input type="text" class="form-control" name="subject" id="subject" data-rule="minlen:4" data-msg="Please enter a subject of at least 8 characters"/>
      <div class="validate"></div>
    </div>
    <div class="form-group">
      <label for="message">Message</label>
      <textarea class="form-control" name="message" rows="10" data-rule="required" data-msg="Please enter a message"></textarea>
      <div class="validate"></div>
    </div>
    <div class="text-center"><button type="submit">Send Message</button></div>
  </form>
</div>


<script>
function get(name){
   if(name=(new RegExp('[?&]'+encodeURIComponent(name)+'=([^&]*)')).exec(location.search))
      return decodeURIComponent(name[1]);
}

</script>


<script>
if (get("result")=="success")
{
alert("Successful");
}
</script>

contact-form-handler.php

<?php
  $name = $_POST['name'];
  $visitor_email = $_POST['email'];
  $subject = $_POST['subject'];
  $message = $_POST['message'];


  $email_from = "Portfolio Email";
  $email_body = "Name: $name.\n".
                "User Email: $visitor_email.\n".
                "User Message: $message.\n";

  $email_to = "email@gmail.com";

  $headers = "From: $email_from \r\n";

  mail($email_to, $subject, $email_body);
?>
<script>
window.location.href="form.html?result=success"
</script>