jquery.validate手动调用校验

这两天在做iframe嵌套的功能,关于iframe页面中的一些校验问题,需要用到手动jquery.validate的情况,先在做以记录,方便日后查看,代码如下:

//加载jquery的校验方法
$("#inputForm").validate({
	errorContainer: "#messageBox",
	errorPlacement: function(error, element) {
		$("#messageBox").text("输入有误,请先更正。");
		if (element.is(":checkbox")||element.is(":radio")||element.parent().is(".input-append")){
			error.appendTo(element.parent().parent());
		} else {
			error.insertAfter(element);
		}
	}
});

//提交时候手动触发校验 
function submitFc(){
	//校验不通过  
	if(!$("#inputForm").valid()){
		return;
	}
	if(confirm("确认要提交?")){ 
		$("#inputForm").submit();
	}
}

这样一来,不论嵌套多少的iframe都可以灵活的去校验了。

传统的提交校验方法如下:

$("#inputForm").validate({
	//校验通过后执行的方法
	submitHandler: function(form){
		form.submit();
	},
	errorContainer: "#messageBox",
	//校验失败后执行的方法
	errorPlacement: function(error, element) {
		$("#messageBox").text("输入有误,请先更正。");
		if (element.is(":checkbox")||element.is(":radio")||element.parent().is(".input-append")){
			error.appendTo(element.parent().parent());
		} else {
			error.insertAfter(element);
		}
	}
});

有了这些基础的知识,校验起来就方便了很多!

下面给出大体的代码,需要的话可以自己调试一下!思路为:判断iframe的数量,计算校验通过的iframe的页面数量,两者相等表示全部校验通过,然后再去执行其他的方法!

//所有iframe子页面项目校验  
sonFormValidate : function(){
	var length= $("#inputForm").find("iframe").length;//需要校验的页面数量 
	var i=0;//最后代表校验通过的页面 
	$("#inputForm").find("iframe").each(function(){
		var okFlag=$(this).contents().find("#inputForm").valid();
		if(okFlag){
		 i++; 
		}
	});
	//所有页面校验通过  
	if(length==i){
		return true;
	}else{//部分页面不通过 
		return false;
	} 
}

仅以此文章记录在开发过程中遇到的问题,方便后续查看校验!

猜你喜欢

转载自blog.csdn.net/u014135369/article/details/83625329