Permalink
Browse files

Form Validator now uses event delegation to watch inputs and whatnot.

  • Loading branch information...
anutron committed Oct 28, 2011
1 parent e63a0cd commit 2869f0b87359face1290e8794a70f3aa3c6b82e4
Showing with 54 additions and 13 deletions.
  1. +27 −0 Docs/Forms/Form.Validator.md
  2. +27 −13 Source/Forms/Form.Validator.js
@@ -93,6 +93,33 @@ Form.Validator comes with numerous built-in validators (see below), each of whic
If you do translate these, please [send them back to us][] so we can add them to our repository.
+Form.Validator Method: enable {#Form-Validator:enable}
+----------------------------------------------------
+
+Enables the form validator, attaching events for submit, blur, and change per the options configuration. This method is invoked on startup.
+
+### Syntax
+
+ myFormValidator.enable();
+
+### Returns
+
+* (*object*) - This instance of [Form.Validator][]
+
+
+Form.Validator Method: disable {#Form-Validator:disable}
+----------------------------------------------------
+
+Disables the form validator, removing events for submit, blur, and change per the options configuration.
+
+### Syntax
+
+ myFormValidator.disable();
+
+### Returns
+
+* (*object*) - This instance of [Form.Validator][]
+
Form.Validator Method: reset {#Form-Validator:reset}
----------------------------------------------------
@@ -15,6 +15,7 @@ authors:
requires:
- Core/Options
- Core/Events
+ - Core/Element.Delegation
- Core/Slick.Finder
- Core/Element.Event
- Core/Element.Style
@@ -116,8 +117,6 @@ Form.Validator = new Class({
Implements: [Options, Events],
- Binds: ['onSubmit'],
-
options: {/*
onFormValidate: function(isValid, form, event){},
onElementValidate: function(isValid, field, className, warn){},
@@ -143,11 +142,15 @@ Form.Validator = new Class({
initialize: function(form, options){
this.setOptions(options);
this.element = document.id(form);
- this.element.store('validator', this);
this.warningPrefix = Function.from(this.options.warningPrefix)();
this.errorPrefix = Function.from(this.options.errorPrefix)();
- if (this.options.evaluateOnSubmit) this.element.addEvent('submit', this.onSubmit);
- if (this.options.evaluateFieldsOnBlur || this.options.evaluateFieldsOnChange) this.watchFields(this.getFields());
+ this._bound = {
+ onSubmit: this.onSubmit.bind(this),
+ blurOrChange: function(event, field){
+ this.validationMonitor(field, true);
+ }.bind(this)
+ };
+ this.enable();
},
toElement: function(){
@@ -158,13 +161,24 @@ Form.Validator = new Class({
return (this.fields = this.element.getElements(this.options.fieldSelectors));
},
- watchFields: function(fields){
- fields.each(function(el){
- if (this.options.evaluateFieldsOnBlur)
- el.addEvent('blur', this.validationMonitor.pass([el, false], this));
- if (this.options.evaluateFieldsOnChange)
- el.addEvent('change', this.validationMonitor.pass([el, true], this));
- }, this);
+ enable: function(){
+ this.element.store('validator', this);
+ if (this.options.evaluateOnSubmit) this.element.addEvent('submit', this._bound.onSubmit);
+ if (this.options.evaluateFieldsOnBlur){
+ this.element.addEvent('blur:relay(input,select,textarea)', this._bound.blurOrChange);
+ }
+ if (this.options.evaluateFieldsOnChange){
+ this.element.addEvent('change:relay(input,select,textarea)', this._bound.blurOrChange);
+ }
+ },
+
+ disable: function(){
+ this.element.eliminate('validator');
+ this.element.removeEvents({
+ submit: this._bound.onSubmit,
+ 'blur:relay(input,select,textarea)': this._bound.blurOrChange,
+ 'change:relay(input,select,textarea)': this._bound.blurOrChange
+ });
},
validationMonitor: function(){
@@ -363,7 +377,7 @@ Form.Validator.addAllThese([
if (typeOf(props.length) != 'null') return (element.get('value').length == props.length || element.get('value').length == 0);
else return true;
}
- }],
+ }],
['minLength', {
errorMsg: function(element, props){

0 comments on commit 2869f0b

Please sign in to comment.