我在bootstrap模式下面。我这里只展示了2个字段。但我有超过10个领域都是强制性的。我点击javascript
中的添加按钮进行Add_click();
验证,并提醒用户All fields are mandatory
。单击Alert后,Modal窗口就会消失。我需要保留此窗口,直到用户提供所有详细信息。
<div id="modalUserAddition" class="modal fade">
<div class="modal-dialog" style="width: 600px">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
×<span class="sr-only">Close</span>
</button>
<h4 class="modal-title">User Details</h4>
</div>
<div class="modal-body">
<div class="form-group">
<input type="text" id="txtUserName" class="form-control" runat="server" placeholder="User Name" />
</div>
<div class="form-group">
<input type="text" id="txtPassword" class="form-control" runat="server" placeholder="Password" />
</div>
</div>
<div class="modal-footer">
<button type="button" id="Close" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" id="Add" onclick="Add_click();" class="btn btn-primary" data-dismiss="modal">Add User</button>
</div>
</div>
</div>
</div>
我尝试了以下代码,但它对我不起作用。
alert('All fields are mandatory!');
//$('#modalUserAddition').modal('toggle');
$('#modalUserAddition').modal({
show: true
});
请帮忙!
答案 0 :(得分:1)
从“添加”按钮中删除data-dismiss="modal"
并通过添加以下内容关闭Add_click中的模式,其中数据被证明有效:
$('#modalUserAddition').modal('hide');
答案 1 :(得分:1)
我认为当您单击警报时,您在模态外部单击,并且由于其本机行为而关闭模式。您可以使用背景选项。传递值为static
的此选项将阻止在模态外部单击后关闭模态。
<button data-target="#myModal" data-toggle="modal" data-backdrop="static">
Launch demo modal
</button>
或者您可以通过JavaScript
来完成$('#myModal').modal({backdrop: 'static'})
<强> DEMO 强>
答案 2 :(得分:0)
由于您正在使用Bootstrap,或许更好的选择是使用其native alerts。
它可以避免您当前的问题并且更加一致。
答案 3 :(得分:0)
当我返回验证结果时,将data-backdrop="static"
放在按钮和return false;
中是有用的。