|
这点微软的验证控件就做的很好，在微软的控件里，默认都有ValidationGroup这个属性，只要把属性名设置为相同就可以进行分组验证了，但是jQuery.Validate自身却没提供这个功能，所以我们只能自己扩展了。
来一下具体的场景，在一个页面里有2个tab页面，不同tab页面需要不同的提交按钮：
这2个就是标准的分组验证情况，如果不设置分组验证的情况下，点击[基本信息提交]和[描述提交]按钮后页面上所有的验证都会被相应，这是因为2个按钮都在一个form表单中，2个按钮的点击事件默认都是在客户端提交表单，然后由服务器端来分配执行代码，所以问题就出现了。
这时我们就需要引入分组验证了，这个解决思路是我在一个国外的网站找到的，不过具体地址我找不到了，这个方法有个弊端就是必须是将需要分组的控件必须放入不同的容器中，如div,table等，因为采用的是标识class样式来进行分组验证。看下具体代码：
view sourceprint?01 //初始化分组验证
function InitValidationGroup() {
$('.validationGroup .causesValidation').click(Validate);
$('.validationGroup :text').keydown(function(evt) {
if (evt.keyCode == 13) {
var $nextInput = $(this).nextAll(':input:first');
if ($nextInput.is(':submit')) {
Validate(evt);
}
else {
evt.preventDefault();
$nextInput.focus();
}
}
});
}
function Validate(evt) {
var $group = $(this).parents('.validationGroup');
var isValid = true;
$group.find(':input').each(function(i, item) {
if (!$(item).valid())
isValid = false;
});
if (!isValid)
evt.preventDefault();
}
上面的代码就是用来进行分组验证的初始化的，这段代码会找寻页面中标有validationGroup样式的元素（分组的容器），然后在这个元素中找带causesValidation样式的元素（这个元素是引发验证的按钮），上面代码实现分组验证的逻辑就是当带causesValidation样式的元素引发验证后会找寻这个元素的父级validationGroup元素，然后遍历validationGroup元素下的所有有验证规则的元素判断是否验证通过。
出处：博客园
责任编辑：bluehearts
上一页 使用jQuery.Validate进行客户端验证(后篇) 上 [1] 下一页 使用jQuery.Validate进行客户端验证(后篇) 上 [3]
◎进入论坛网页制作、WEB标准化版块参加讨论，我还想发表评论。
|
第 1 页 
第 2 页 使用jQuery.Validate进行客户端验证(后篇) 上 [2]
