Question

我正在创建一个婚礼网站，其中包含用于RSVP的PHP表单。我充其量只是个新手。

我要做的是，一旦用户填写并提交表单，网页就会将他们带到成功/感谢页面。 （这部分正在运作）。

或者如果表单没有正确填写，它会显示一个bootstrap模式，告诉他们他们做错了什么。 （这是我遇到的麻烦）。

这是我的代码，与模态部分有关。

在我看来，我的PHP if语句应该在出现任何类型的错误时运行JavaScript。 JavaScript应该打开一个显示错误的模态窗口。什么没有连接？

＆＃13;

<?php
    if ($_POST["submit"]) {
      $result='<div class="alert alert-success">Form submitted</div>';

      if (!$_POST["name"]) {
        $error.="<br> Please enter the name on your invitation.";
      }
      if (!$_POST["head-count"]) {
        $error.="<br> Please enter the size of your party.";
      }
      if (!$_POST["reception-check"]) {
        $error.="<br> Please let us know if you will be attending the reception.";
      }
      if ($error) { ?>
        <script type="text/javascript"> $('#myModal').modal('show'); </script>
        <?php
      } else {
        if (mail("dprb17@gmail.com", "RSVP", "

        Name: ".$_POST['name']."

        Head Count: ".$_POST['head-count']."

        Reception Check: ".$_POST['reception-check']."

        Comments: ".$_POST['comments'])) {
          header("location: http://www.ourpeachwedding.com/pages/thankyou.php");
          exit();
        } else {
          $result='<div class="alert alert-danger"><strong>Sorry, there was an error submitting your rsvp, please try again.</strong>'.$error.'</div>';
        }
      }
    }

    ?>

    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
      <h4 class="modal-title" id="myModalLabel">Modal title</h4>
    </div>
    <div class="modal-body">
      <?php echo $result ?>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      <button type="button" class="btn btn-primary">Save changes</button>
    </div>
  </div>
</div>
</div>

＆＃13;

    <div id="rsvp">
      <div class="jumbotron">

        <?php echo $result; ?>

        <div class="container-fluid">
          <p class="text-center h1">RSVP</p>
          <p class="lead text-center">Even if you are not planning to attend, please RSVP anyway.</p>
          <div class="row">
            <div class=" col-md-6 col-md-offset-3">
              <form method="post">
                <div class="input-group">
                  <span class="input-group-addon">Name:</span>
                  <input name="name" type="text" class="form-control" placeholder="What was the name on the invitation?" value="<?php echo $_POST['name']; ?>">
                </div> <!--/.input-group-->
                <hr>
                <div class="input-group">
                  <span class="input-group-addon">Head Count:</span>
                  <input name="head-count" type="text" class="form-control" placeholder="How many in your party?" value="<?php echo $_POST['head-count']; ?>">
                </div> <!--/.input-group-->
                <hr>
                <div class="input-group">
                  <span class="input-group-addon">Reception?</span>
                  <input name="reception-check" type="text" class="form-control" placeholder="Will you be attending the reception?" value="<?php echo $_POST['reception-check']; ?>">
                </div> <!--/.input-group-->
                <hr>
                <div class="input-group">
                  <span class="input-group-addon">Comments:</span>
                  <textarea name="comments" type="text" class="form-control" placeholder="eg. gluten/food allergies, not attending, etc."><?php echo $_POST['comments']; ?></textarea>
                </div> <!--/.input-group-->
                <hr>
                <div class="text-center">
                  <input type="submit" name="submit" class="btn btn-success btn-large" value="Submit">
                </div> <!--/.text-center-->
              </form>
            </div> <!--/.col-->
          </div> <!--/.row-->
        </div> <!--/.container-fluid-->
      </div> <!--/.jumbotron-->
    </div> <!--/#rsvp-->

＆＃13;

Answer 1

我认为，为此目的，验证是否在客户端完成并不是非常重要。如果您愿意，可以将其更改为客户端验证，但您添加的脚本不起作用，因为它在加载必要的html元素之前运行。为了确保它在之后运行，请将该行更改为

if ($error) { ?>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#myModal').modal('show');
        });
    </script>
    <?php
} else {
...

只有在出现错误时才会添加脚本，因此它会在加载时运行，但仅在提交后重新加载页面并发现错误时才会运行。

Answer 2

我有同样的问题并解决了它：您必须echo脚本，因为当您结束php代码?>并再次启动<?php时，结束和开始之间的代码将被忽略或始终可见/启用。看下面的例子，我认为这样可行！

 if ($error) { ?>
    <script type="text/javascript"> $('#myModal').modal('show'); </script>
    <?php
 }

必须

 if ($error) { 
   echo '<script type="text/javascript"> $("#myModal").modal("show")</script>';
 }

脚本中的'已替换为"，因为'会忽略"所以它只是回应它

您的代码中的其他一些内容：if ($error)或if (!$_Post[...])它不起作用，因为在这种情况下没有$error = 1或T$_Post[...] > "1"这样的要求，if将永远不会跑在这里：

    if (mail("dprb17@gmail.com", "RSVP", "

    Name: ".$_POST['name']."

    Head Count: ".$_POST['head-count']."

    Reception Check: ".$_POST['reception-check']."

    Comments: ".$_POST['comments'])) {
      header("location: http://www.ourpeachwedding.com/pages/thankyou.php");
      exit();

没有后果

我认为这项工作非常好！我希望这会奏效！祝你好运....并检查你的代码。

如何用PHP打开bootstrap模式？

2 个答案: