Tuesday, 4 November 2008

Hack on FormCheck : Self-defining Validation

尽管FormCheck提供了很多的validation模式,但在实际应用中,总会遇到不够的时候,比如Fine Validation,多元素联合验证等等。这些validation的功能,往往需要自己去定义。

FormCheck目前的版本,还没有开放自定义validate函数的接口。只能先自己定义自定义函数接口,然后再把自定义validate函数adapt上去。

310:   validate : function(el) {
   :     ...
316:     el.validation.each(function(rule) {
317:       if(this.isChildType(el)) {
   :         ...
321:       } else {
   :         ...
344:         if (el.get('tag') == "select" || (el.type == "checkbox" && ruleMethod == 'required')) {
345:           if (this.simpleValidate(el) == false) {
346:              el.isOk = false;
347:           }
348:         }
349: 
350:         if(rule.match(/%[a-z0-9_]+$/) || (el.isOk && rule.match(/~[a-z0-9_]+$/))) {
351:           if( eval(rule.slice(1)+'(el)') == false ) {
352:             el.isOk = false;
353:           }
354:         }
355:       }
356:     }, this);
357:
358:     if (el.isOk) return true;
359:     else return false;
360:   },

* 以上改动,基于FormCheck v.1.4RC6。

350~354为增加的自定义validate函数接口。这里,定义了两种形式的接口,分别是:

  %myvalidate   '%'+自定义函数名,该validate将和其它validate一起工作;

  ~myvalidate   '~'+自定义函数名,该validate只有在其它validate都通过了之后,才会进行。属于额外的validate。应该是validate列表的最后一项。

自定义validate函数,要求能够接受element作为参数,并以true/false的形式,返回验证的结果。如果验证的结果为false,还需要手工设置出错信息。其基本结构,如下:

  1:   function myvalidate(el) {
  2:     var elValue = el.value;
  3:     var elStatus;
  4: 
  5:     elStatus = ... (elValue);
  6: 
  7:     if( elStatus ) {
  8:       return true;
  9:     }
 10:     else {
 11:       el.errors.push("It's really bad.");
 12:       return false;
 13:     }
 14:   }

在表单的INPUT中,使用自定义函数进行validation:validate['required','%myvalidate'],或者validate['required','~myvalidate']。

0 Comments:

Post a Comment

<< Home