EDIT:我注意到当我单击模式内的按钮时,会显示强制弹出窗口,并且不允许继续。
我需要使用引导程序模式来添加有关某些授权的一些详细信息。因此,我有一个cshtml页面,其中包含一些必填字段和一个打开模式的按钮。但是,当我单击按钮时,即使字段为空,也会显示模式。我该如何解决?
按钮代码:
<div class="col-sm-2"><input type="submit" value="@Risorse.Language.InserisciAutorizzazione" class="btnRegister btn btn-default" data-toggle="modal" data-target="#modalLoginForm" /></div>
模式(不是我将要使用的模式,我仅将其放在cshtml中用于测试):
<div class="modal fade" id="modalLoginForm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header text-center">
<h4 class="modal-title w-100 font-weight-bold">Sign in</h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body mx-3">
<div class="md-form mb-5">
<i class="fas fa-envelope prefix grey-text"></i>
<input type="email" id="defaultForm-email" class="form-control validate">
<label data-error="wrong" data-success="right" for="defaultForm-email">Your email</label>
</div>
<div class="md-form mb-4">
<i class="fas fa-lock prefix grey-text"></i>
<input type="password" id="defaultForm-pass" class="form-control validate">
<label data-error="wrong" data-success="right" for="defaultForm-pass">Your password</label>
</div>
</div>
<div class="modal-footer d-flex justify-content-center">
<button class="btn btn-default">Login</button>
</div>
</div>
</div>
</div>
这是图形结果:
如您所见,将弹出有关字段为必填字段的警报,但实际上也可能不会输入。
我的想法是仅在所有必填字段均已填写的情况下,通过JS打开模式。但是我想知道是否还有一种更优雅的方法。
谢谢。
使用下面的代码在验证之前防止模型,
HTML:
我认为您的按钮代码中的type属性是问题的原因。尝试将值“提交”更改为“按钮”。