我一直在努力弄清楚这里发生了什么。
所以,我有 super 基本的形式。但 bootstrap 阻止它提交。都没有
<button value="submit" type="submit">
也不
<input type="submit" value="Save" class="btn btn-primary"/>
作品。一旦我禁用 Bootstrap ,表单就会提交。
似乎是一个奇怪的 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>
最佳答案
因为
data-toggle="tab"
在父div上。 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>
关于javascript - Bootstrap 阻止表单提交,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37380665/