Bootstrap3、Popover、PHP - 内部联系表单损坏，Popover 内容中断答案

【问题标题】：Bootstrap3, Popover, PHP - Contact Form Inside Broken, and Popover breaks with contentBootstrap3、Popover、PHP - 内部联系表单损坏，Popover 内容中断
【发布时间】：2014-01-24 10:04:09
【问题描述】：

<a class="btn btn-primary" id="popover">xxx</a></li>
                                                            <div id="popover-head" class="hide"><h3 class="popover-title" style="color:#333;">xxx</h3></div>
                                                            <div id="popover-content" class="hide">
<?php  
            // check for a successful form post  
            if (isset($_GET['s'])) echo "<div class=\"alert alert-success\">".$_GET['s']."</div>";  
            // check for a form error  
            elseif (isset($_GET['e'])) echo "<div class=\"alert alert-danger\">".$_GET['e']."</div>";  
        ?>
        <form role="form" method="POST" action="*.php">
              <div class="row">
                <div class="form-group col-lg-12">
                    <label for="input1">Name</label>
                    <input type="text" name="contact_name" class="form-control" id="input1">
                </div>
              </div>
              <div class="row">
                <div class="form-group col-lg-12">
                    <label for="input2">Email Address</label>
                    <input type="email" name="contact_email" class="form-control" id="input2">
                </div>
              </div>
              <div class="row">
                <div class="form-group col-lg-12">
                    <label for="input3">Phone Number</label>
                    <input type="phone" name="contact_phone" class="form-control" id="input3">
                </div>
              </div>
              <div class="clearfix"></div>
                <div class="form-group col-lg-12">
                    <label for="input4">We will be in touch soon!</label>
                    <textarea name="contact_message" rows="6" style="display:none" class="form-control" id="input4">xxx</textarea>
              </div>
              <div class="form-group col-lg-12">
                <input type="hidden" name="save" value="contact">
                <button type="submit" class="btn btn-primary">Submit</button>
              </div>
          </div>
        </form>

这段代码有 2 个问题。第一个问题是，当我将表单插入 bootstrap3 弹出框时，它会中断。第二个问题是弹出框不会打开。如果我从中删除代码，弹出框会打开，如果它不在弹出框内，则 php 脚本会运行。

【问题讨论】：

标签： php twitter-bootstrap twitter-bootstrap-3 popover contact-form

【解决方案1】：

甚至不需要弹出窗口。我的这个简单代码也完全破坏了 Bootstrap 3！

<form class="navbar-form navbar-left" name="contact" action="<?php echo $_SERVER('PHP_SELF'); ?>" method="get">
    <div class="form-group">
      <p>
        <label for="name">Name</label>
        <input type="text" name="name" id="name">
      </p>
      <p>
        <label for="email">Email</label>
        <input type="text" name="email" id="email">
      </p>
      <p>
        <label for="comments">Comments</label>
        <textarea name="comments" id="comments"></textarea>
      </p>
    </div>
    <p>
      <input type="submit" name="send" id="send" value="Send Comments">
    </p>
  </form>
  <?php 
if($_GET){
        echo "Contents of the $_GET array<br >";
        print_r($_GET);
    }elseif ($_POST){
                        echo "Contents of the $_POST array<br >";
        print_r($_POST);
        }

【讨论】：