引导程序表单未提交


bootstrap form is not getting submitted

我正在使用Bootstrap并尝试将表单提交到PHP页面。但是form没有被提交。

<div class="container">   
  <div class="row">
    <div class="col-md-5 col-sm-12">
      <ul class="timeline" data-offset-top="3">
        <li>
          <div class="timeline-panel">
            <form name="Wall_Post" id="Wall_Post" action="/update.php"  method="post" role="form" enctype="multipart/form-data" class="facebook-share-box">
              <div class="timeline-body">
                <div class="share-form">
                  <ul class="post-types">
                    <li class="post-type">
                      <a class="status" id="shareType" href="#"><i class="fa fa-file"></i> Status</a>
                    </li>
                    <li class="post-type">
                      <a class="photos" id="shareType" href="#"><i class="fa fa-camera"></i> Photos</a>
                    </li>
                    <li class="post-type">
                      <a class="videos" id="shareType" href="#"><i class="fa fa-film"></i> Video</a>
                    </li>
                    <li class="post-type">
                      <a class="location" id="shareType" href="#"><i class="fa fa-map-marker"></i> Place</a>
                    </li>
                  </ul>
                  <div class="share">
                    <div class="arrow"></div>
                    <div><textarea name="message" cols="40" rows="10" id="status_message" class="form-control message" style="height: 62px; overflow: hidden;" placeholder="What's on your mind ?"></textarea> </div>
                    <div class="image hide">
                      <input type="file" class="form-control" name="image" id="image" />
                    </div>
                    <div class="video hide">
                      <input type="text" class="form-control" placeholder="Youtube or Vimeo video URL" id ="videoUrl" name="videoUrl"/>
                    </div>
                    <div class="place hide">
                      <input id="geocomplete" class="form-control" type="text" name="location" placeholder="Enter a location" />
                      <div class="map_canvas"></div>
                      <input type="hidden" name="lat" />
                      <input type="hidden" name="lng" />
                    </div>
                    <input type="hidden" name="shareType" class="shareType" value="status" />
                  </div>
                </div>
              </div>
              <div class="timeline-footer clearfix">
                <div class="pull-right">
                  <input type="submit" name="submit" value="Post" id="btn-share" class="btn btn-primary" />
                </div>
              </div>
            </form>
          </div>
        </li>
      </ul>
    </div>
  </div>     
</div>  

此外,我在我的网站中使用jquery v1.11.1,在不包括jquery v1.11.1的其他页面中,相同的代码也能很好地工作。还有一件事我不想用ajax提交表单。有可能吗?

你的html工作得很好(尽管有一些重复的id。)。当我点击提交按钮时,表单会提交到/update.php。所以一定是javascript阻止了表单提交。你有javascript文件吗?如果是的话,他们会在提交表格方面做些什么吗?

编辑:我在你对javascript文件发表评论后发现了这个问题:在你的script.js中,你在第12行做了一个$("form").submit()。在这个函数的末尾,您将执行return false;。这将覆盖每个表单的提交过程。删除第47行的return false;和第45行的CCD-6(或者只删除switch语句中的整个默认部分)!

也许您键入action="/update.php"错误,请尝试使用action="../update.php 进行更改

正如@Laurens所说,您在该函数结束时返回false,但也根据提交的表单的id执行切换语句,默认操作是在id不是三个声明之一的情况下返回false。这意味着这个表单(不是列出的三个表单之一)将触发默认操作并返回false-因此不提交表单。您需要为这个表单添加一个切换案例,就像您使用其他一样

一个错误是,您有多个相同id("shareType")的实例-我不知道这是否导致了问题-但您应该将这些实例更改为每个链接的唯一id。复制的id示例如下:

<a class="status" id="shareType" href="#"><i class="fa fa-file"></i> Status</a>