一页联系表单,提交后重定向到表单&防止在页面刷新时重新提交


One page contact form, redirect to form after submit & prevent resubmit on page refresh

我在这里搜索了,似乎找不到一个令人满意的解决方案,所以我问这个问题。

我有一个单页网站的形式,有关发送到正确的电子邮件地址,并显示正确的回声结果头工作;但在测试时,每次刷新页面都会重新发送消息,除此之外,我还希望浏览器视图端口在按下提交按钮后显示联系人表单,以便用户可以看到发送的表单或错误消息。

这是我的代码…

    <?php
        $name = $_POST['name'];
        $email = $_POST['email'];
        $message = $_POST['message'];
        $from = $_POST['email']; 
        $to = 'marc@**************.com'; 
        $subject = 'New enquiry from website';
        $human = $_POST['human'];
        $body = "From: $name'n E-Mail: $email'n Message:'n $message";
        if ($_POST['submit'] && $human == '4') {                 
            if (mail ($to, $subject, $body, $from)) { 
            echo '<p class="emailSent">Thanks. Your message has been sent! We will be in touch shortly.</p>';
        } else { 
            echo '<p class="errorMessage">Something went wrong, go back and try again!</p>'; 
        } 
        } else if ($_POST['submit'] && $human != '4') {
            echo '<p class="errorMessage">You answered the anti-spam question incorrectly. Please try again.</p>';
        }
    ?>

    <div class="large-6 medium-6 small-12 columns form-left">
      <form  class="footer-form" method="post" action="index.php">
         <div class="row">   
              <div class="medium-9 medium-push-3 columns">
                <label>
                  <input name="name" type="name" id="name" value="" placeholder="Your name" />
                </label>
              </div>
        </div>
        <div class="row">
              <div class="medium-9 medium-push-3 columns">
                <label>
                  <input name="email" type="email" id="email" value="" placeholder="Email Address" />
                </label>
              </div>
        </div>
        <div class="row">
              <div class="medium-9 medium-push-3 columns">
                <label>
                  <textarea name="message" id="message" placeholder="Your enquiry"></textarea>
                </label>
              </div>
        </div>
        <div class="row">
               <div class="medium-9 medium-push-3 columns">
                  <label>*What is 2+2? (Anti-spam)</label>
                  <input name="human" id="name" placeholder="Type Here">    
              </div>
        </div>
        <div class="row">
            <div class="medium-9 medium-push-3 columns">
              <button class="submit contact-button" id="name" name="submit" type="submit" value="Send email">Send</button>
            </div>
        </div>
      </form>
    </div>

我真的很感激你在这方面的帮助。

谢谢。Marc

你的意思是浏览器询问你是否想在刷新后重新提交表单?如果是这样,它总是会重新提交信息,但是,您可以做的是将php代码放在另一个文件中,告诉表单转到该文件,并在脚本执行后重定向到表单页面。

编辑

为表单创建一个页面,命名为form。php

在你的模板页面上,或者任何你的用户界面(在这个例子中我们假设它是index.php),用同样的方式创建一个表单,但是不是将页面的"action"设置为index.php,而是将其设置为form.php。

<form action="form.php" method="post">

如果您希望将用户重定向到表单的另一个页面,则只需执行此操作。然后他们就可以在你的网站上找到他们。

如果您想立即将它们带回index.php,请使用此

仍然执行第一步,即不是将页面的"action"设置为index.php,而是将其设置为form.php。

<form action="form.php" method="post">

现在,当用户在form.php上时,一切都会很快发生,所以确保在脚本的最后,使用header('Location: index.php');

将它们重定向回index.php

你还说你想要一个错误或成功方法,没问题。如果您希望消息依赖于表单页面中的if语句,可以这样做。在form.php上,在重定向它们之前,创建一个$message变量并将其设置为所需的任何值。然后回到index.php中,编写一个include_once('form.php');,它将允许您使用在index.php中在form.php上创建的$message变量。

在用户被重定向之前,消息应该是$message = "",所以在提交表单之前什么都不会显示,但是这个解决方案应该工作得很好,我希望这有助于!

不要将header函数中的'Location'设置为'index.php',只需将其设置为您在其中创建的表单的页面名称,就可以了。