页面上有多个表单,带有Bootstrap 3模态

时间:2015-03-24 06:14:56

标签: php html forms twitter-bootstrap bootstrap-modal

我遇到一个问题,就是在单个html上获取我的两个表单中的第二个来处理数据。我正在使用Bootstrap 3框架,并且在模式中有一个正确处理的表单,即用户单击提交按钮并正确处理表单。

页面上还有另一种表格无法正确处理。当用户单击提交按钮时,表单应该被处理并将用户带到新页面(goodsub.html),但是当单击提交按钮时,没有任何反应。我的HTML有问题吗?

我是PHP的新手,所以我使用了一些预制的PHP文档,这些文档似乎对页面上的第一个表单工作正常。请注意,当我在模态中注释掉表单时,我的“第二”表单会正确处理并将用户发送到goodsub.html。

可以在http://josephsamora.com/contact.html

查看相关网页

以下是我的工作代码:

<!--modal-->
<div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
<div class="modal-content">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">I look forward to hearing from you.</h3>
  </div>
  <div class="modal-body">
    <form id="personalform" name="personalform" action="mail_form.php" method="post" class="form-horizontal col-sm-12">
      <div class="form-group"><input class="form-control required" placeholder="Your name*" data-placement="top" data-trigger="manual" data-content="Must be at least 3 characters long, and must only contain letters." type="text" name="Name"></div>
      <div class="form-group"><textarea name="Message" class="form-control" placeholder="Your message here..*" data-placement="top" data-trigger="manual"></textarea></div>
      <div class="form-group"><input name="email" class="form-control email" placeholder="email@you.com (so that I can contact you)*" data-placement="top" data-trigger="manual" data-content="Must be a valid e-mail address (user@gmail.com)" type="text"></div>
      <div class="form-group"><input type="hidden" name="recipients"
value="walshv10@gmail.com" />
<input type="hidden" name="good_url" value="goodsub.html" />
<input type="hidden" name="bad_url" value="badsub.html" /></div>
      <div class="form-group"><input Name="Phone Number" class="form-control phone" placeholder="Phone Number: 999-999-9999" data-placement="top" data-trigger="manual" data-content="Must be a valid phone number (999-999-9999)" type="text"></div>
      <div class="form-group"><button type="submit" name="Sendit" value="Sendit" class="btn btn-success pull-right">Send It!</button> <p class="help-block pull-left text-danger hide" id="form-error">&nbsp; The form is not valid. </p></div>
    </form>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
  </div>
</div>

非工作形式:

  <div class="row">
<div class="col-md-4 col-md-offset-4">


     <form id="fullform" name="fullform" action="mail_form.php" method="post" class="form-horizontal" role="form">

      <!--Hidden Section-->
      <div class="form-group"><input type="hidden" name="recipients"
value="walshv10@gmail.com"/>
<input type="hidden" name="good_url" value="goodsub.html" />
<input type="hidden" name="bad_url" value="badsub.html" /></div>
<!-- Form Section Name -->
      <h3>Name & Email</h3>
      <hr>

      <!-- Text Input -->
        <div class="form-group">
        <label class="col-sm-3 control-label">First Name*</label>
        <div class="col-sm-9">
          <input type="text" placeholder="First Name" class="form-control" data-placement="top" data-trigger="manual" name="First Name" required="">
        </div>
      </div>

      <!-- Text Input -->
        <div class="form-group">
        <label class="col-sm-3 control-label">Last Name*</label>
        <div class="col-sm-9">
          <input type="text" placeholder="Last Name" class="form-control" data-placement="top" data-trigger="manual" name="Last Name" required="">
        </div>
      </div>

      <!-- Text Input -->
        <div class="form-group">
        <label class="col-sm-3 control-label">Email*</label>
        <div class="col-sm-9">
          <input type="text" placeholder="Email" class="form-control" data-placement="top" data-trigger="manual" name="Email" required="">
        </div>
      </div>


      <!-- Form Section Name -->
      <h3>Address Details</h3>
      <hr>

      <!-- Text input-->
      <div class="form-group">
        <label class="col-sm-2 control-label">Line 1</label>
        <div class="col-sm-10">
          <input type="text" placeholder="Address Line 1" class="form-control" data-placement="top" data-trigger="manual" name="Address Line 1">
        </div>
      </div>

      <!-- Text input-->
      <div class="form-group">
        <label class="col-sm-2 control-label">Line 2</label>
        <div class="col-sm-10">
          <input type="text" placeholder="Address Line 2" class="form-control" data-placement="top" data-trigger="manual" name="Address Line 2">
        </div>
      </div>

      <!-- Text input-->
      <div class="form-group">
        <label class="col-sm-2 control-label">City</label>
        <div class="col-sm-10">
          <input type="text" placeholder="City" class="form-control" data-placement="top" data-trigger="manual" name="City">
        </div>
      </div>

      <!-- Text input-->
      <div class="form-group">
        <label class="col-sm-2 control-label">State</label>
        <div class="col-sm-4">
          <input type="text" placeholder="State" class="form-control" data-placement="top" data-trigger="manual" name="State">
        </div>

        <label class="col-sm-2 control-label">Postcode</label>
        <div class="col-sm-4">
          <input type="text" placeholder="Post Code" class="form-control" data-placement="top" data-trigger="manual" name="Post code">
        </div>
      </div>



      <!-- Text input-->
      <div class="form-group">
        <label class="col-sm-2 control-label">Country</label>
        <div class="col-sm-10">
          <input type="text" placeholder="Country" class="form-control" data-placement="top" data-trigger="manual" name="Country">
        </div>
      </div>

      <!-- Form Section Name -->
      <h3>Other Contact Info</h3>
      <hr>

      <!--Text Input -->
      <div class="form-group">
        <label class="col-sm-3 control-label">Phone Number</label>
        <div class="col-sm-9">
          <input type="text" placeholder="Phone Number" class="form-control" data-placement="top" data-trigger="manual" name="Phone Number">
        </div>
      </div>

      <!--Text Input -->
      <div class="form-group">
        <label class="col-sm-3 control-label">Organization</label>
        <div class="col-sm-9">
          <input type="text" placeholder="Organization" class="form-control" data-placement="top" data-trigger="manual" name="Organization">
        </div>
      </div>

      <!-- Form Section Name -->
      <h3>Message</h3>
      <hr>

      <!--Text Input -->
      <div class="form-group">
        <label class="col-sm-2 control-label">Subject</label>
        <div class="col-sm-10">
          <input type="text" placeholder="Subject" class="form-control" data-placement="top" data-trigger="manual" name="Subject">
        </div>
      </div>

      <!-- Textarea -->
      <div class="form-group">
        <label class="col-sm-2 control-label" for="Message">Message*</label>
        <div class="col-sm-10">                     
          <textarea class="form-control" id="Message" name="Message" placeholder="Message" required data-placement="top" data-trigger="manual"></textarea>
        </div>
      </div>

      <div class="form-group">
        <div class="col-sm-offset-2 col-sm-10">
          <div class="pull-right"> 
                <div class="form-group"><button type="submit" name="submit" value="submit" class="btn btn-success pull-right">Submit</button></div>
          </div>
        </div>
      </div>
</form>
</div>
</div>

我还在head标签上面有以下PHP:

    <?php 
    if (!empty($_POST['submit'])) {
       //send to submit;
    }

    if (!empty($_POST['Sendit'])) {
       //send to Sendit;
    }
    ?>

谢谢!

1 个答案:

答案 0 :(得分:0)

remove this section from your non working form

<!--Hidden Section-->
      <div class="form-group"><input type="hidden" name="recipients"
value="walshv10@gmail.com"/>
<input type="hidden" name="good_url" value="goodsub.html" />
<input type="hidden" name="bad_url" value="badsub.html" /></div>