抱歉没有问题。我已阅读Show Twitter Bootstrap modal on form submit并从那里复制粘贴了一些代码,但它没有帮助。
我试图在我的网页上实施以下行为:
如果' id_field1'和' id_field2'填充字段,然后,当用户按下“提交”字段时,按钮,必须提交表格并显示以下模态窗口:
" [添加另一个]或[重定向到其他页面]?"。
必须显示简单警报(" id_field1"" id_field2"必须填写字段)
但是如果字段没有填充,我的代码当前会呈现模态窗口,并且不会提交任何内容。
HTML
<form method="POST">
<input class="form-control" id="id_field1" name="field1" type="text" required="">
<input class="form-control" id="id_field2" name="field2" type="text" required="">
<button type="button" class="btn btn-xl btn-success" data-toggle="modal" data-target="#myModal" id="formsubmit">Add item</button>
</form>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog modal-sm">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Item was successfully added</h4>
</div>
<div class="modal-body">
<p>Add another?</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Yes</button>
<a href="some_url" class="btn btn-primary">No</a>
</div>
</div>
</div>
</div>
的jQuery
$(function(){
$( "#formsubmit" ).click(function() {
$( "form" ).submit(function(evt){
field1 = $( '#id_field1' ).val();
fiedl2 = $( '#id_field2' ).val();
if((field1 === '') && (field2 === '')){
alert("You must enter tenant's name and phone at least");
evt.preventDefault();
} else {
$( '#myModal' ).modal('show');
}
});
});
});
非常感谢你。
答案 0 :(得分:1)
您必须先将字段值设置为变量。
$(function(){
$( '#formsubmit' ).click(function() {
var1 = $( '#id_field1' ).val();
var2 = $( '#id_field2' ).val();
if((var1 === "") && (var2 === "")) {
alert("field1 and field2 must be populated");
return false;
} else {
$( '#myModal' ).modal('show');
}
});
});
更新