[英]Jquery code to show modal after form validation is done
接下来是这个问题: 上一个问题
我的表单上有表单验证,需要先进行验证,即最小字符和数字等。
到目前为止,我的Jquery代码显示了按下“提交”按钮之后的模式,并且表单中有一些输入,但是没有有效的输入,因此我只需要输入几个字符,然后弹出模式,这是不理想的。
因此,我需要表格进行输入和验证,然后弹出模式,并且用户必须接受条款和条件才能注册。
我没有运气就尝试了以下方法:
$(document).ready(function() {
$("#login-form").submit.valid(function(e) {
e.preventDefault();
$(".modal").addClass("active");
});
});
提前致谢
您应该在提交事件中使用if:
$("#login-form").submit(function(e) {
e.preventDefault();
if ($(this).valid()) { // this assumes you are using something like jquery validate - from your original code, it looks like you were attempting to do this
$(".modal").addClass("active");
} else {
// do error stuff here
}
});
为什么使用有效? jQuery valid()
不接受任何参数,仅返回true。 使用validate()
代替使用处理程序。
$("#yourform").validate({
submitHandler: function(form) {
// ...
form.submit();
}
});
您可以在表格上执行此操作...
<form id="myform" action=".." method=".." onsubmit="return validateForm(this);">
.....
</form>
然后在您的脚本中定义validate(this)函数,该函数接收表单对象(this)。 现在假设您使用的是jQuery表单验证插件
function validate(formObj){
v = $(formObj).validate({ // initialize the plugin
rules: { //enter additional rules.
input1: {required: true, email:true},
input2: {required: true, integer:true}
},
submitHandler: function(formObj) {
$('#myform').removeAttr('onsubmit'); //remove the onsubmit attr..
$(modal).addClass('active'); //then show the modal here..
}
});
return false; //which stops the form from submitting..
}
现在让我们假设模式已弹出并且用户已接受协议并单击“同意”按钮,然后触发表单并发送表单
function sendFromModal(){
$('#myform').submit();
return true; //
}
这应该工作,我希望我能有所帮助。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.