Bootstrap阻止提交表單

我一直在努力想知道這裏發生了什麼。Bootstrap阻止提交表單

所以，我有超強的基本形式。但引導防止它提交。

<button value="submit" type="submit"> 也不 <input type="submit" value="Save" class="btn btn-primary"/>工程。一旦我禁用引導，表單提交。

似乎是一個奇怪的e.preventDefault觸發。但爲什麼？我不明白這一點...

我的形式：

<div class="well page active" id="personalInfo" data-toggle="tab"> 
<form class="form-horizontal" method="post" action="test/save"> 
    <fieldset> 
     <div class="form-group"> 
      <label for="surname" class="col-md-2 control-label">surname</label> 
      <div class="col-md-10"> 
       <input type="text" class="form-control" id="surname" name="surname" value=""> 
      </div> 
     </div> 
     <div class="form-group"> 
       <button value="submit" type="submit" class="btn btn-primary">Save</button> 
     </div> 
    </fieldset> 
<input type="hidden" name="_csrf" value="c9e458bf-6565-4b8d-bba7-6516af8e1be9"> 
</form> 
</div>

這是堆棧跟蹤，什麼阻止它：

來源

2016-05-22 Artems

創建沙盒的網站，如jsfiddle.net或再現問題的其他類似網站的演示。該圖顯示與選項卡相關的代碼，但未顯示問題html中的選項卡 – charlietfl

請添加您的表單正在調用的action =「test/save」代碼。 –

其因的

data-toggle="tab"

上母公司Bootstrap將div的整個內容綁定到該點擊事件。如果您打算讓可點擊的選項卡也包含表單，則需要手動處理選項卡事件。

例。

腳本：

$('#personalInfo a').click(function (e) { 
    e.preventDefault() 
    $(this).tab('show') 
});

HTML：

<div class="well page active" id="personalInfo"> 
<a href='#'>Tab</a> 
<form class="form-horizontal" method="post" action="test/save"> 
<fieldset> 
    <div class="form-group"> 
     <label for="surname" class="col-md-2 control-label">surname</label> 
     <div class="col-md-10"> 
      <input type="text" class="form-control" id="surname" name="surname" value=""> 
     </div> 
    </div> 
    <div class="form-group"> 
      <button value="submit" type="submit" class="btn btn-primary">Save</button> 
    </div> 
</fieldset> 
<input type="hidden" name="_csrf" value="c9e458bf-6565-4b8d-bba7-6516af8e1be9"> 
</form> 
</div>

來源

2016-05-23 04:55:00

謝謝。這工作。雖然標準標籤中的表單被阻止提交是愚蠢的。 – Artems

Bootstrap阻止提交表單

回答

相關問題