| OLD | NEW |
| 1 /** | 1 /** |
| 2 * Singleton IronMeta instance. |
| 3 */ |
| 4 Polymer.IronValidatableBehaviorMeta = null; |
| 5 |
| 6 /** |
| 2 * `Use Polymer.IronValidatableBehavior` to implement an element that validate
s user input. | 7 * `Use Polymer.IronValidatableBehavior` to implement an element that validate
s user input. |
| 3 * Use the related `Polymer.IronValidatorBehavior` to add custom validation lo
gic to an iron-input. | 8 * Use the related `Polymer.IronValidatorBehavior` to add custom validation lo
gic to an iron-input. |
| 4 * | 9 * |
| 5 * By default, an `<iron-form>` element validates its fields when the user pre
sses the submit button. | 10 * By default, an `<iron-form>` element validates its fields when the user pre
sses the submit button. |
| 6 * To validate a form imperatively, call the form's `validate()` method, which
in turn will | 11 * To validate a form imperatively, call the form's `validate()` method, which
in turn will |
| 7 * call `validate()` on all its children. By using `Polymer.IronValidatableBeh
avior`, your | 12 * call `validate()` on all its children. By using `Polymer.IronValidatableBeh
avior`, your |
| 8 * custom element will get a public `validate()`, which | 13 * custom element will get a public `validate()`, which |
| 9 * will return the validity of the element, and a corresponding `invalid` attr
ibute, | 14 * will return the validity of the element, and a corresponding `invalid` attr
ibute, |
| 10 * which can be used for styling. | 15 * which can be used for styling. |
| 11 * | 16 * |
| 12 * To implement the custom validation logic of your element, you must override | 17 * To implement the custom validation logic of your element, you must override |
| 13 * the protected `_getValidity()` method of this behaviour, rather than `valid
ate()`. | 18 * the protected `_getValidity()` method of this behaviour, rather than `valid
ate()`. |
| 14 * See [this](https://github.com/PolymerElements/iron-form/blob/master/demo/si
mple-element.html) | 19 * See [this](https://github.com/PolymerElements/iron-form/blob/master/demo/si
mple-element.html) |
| 15 * for an example. | 20 * for an example. |
| 16 * | 21 * |
| 17 * ### Accessibility | 22 * ### Accessibility |
| 18 * | 23 * |
| 19 * Changing the `invalid` property, either manually or by calling `validate()`
will update the | 24 * Changing the `invalid` property, either manually or by calling `validate()`
will update the |
| 20 * `aria-invalid` attribute. | 25 * `aria-invalid` attribute. |
| 21 * | 26 * |
| 22 * @demo demo/index.html | 27 * @demo demo/index.html |
| 23 * @polymerBehavior | 28 * @polymerBehavior |
| 24 */ | 29 */ |
| 25 Polymer.IronValidatableBehavior = { | 30 Polymer.IronValidatableBehavior = { |
| 26 | 31 |
| 27 properties: { | 32 properties: { |
| 28 | 33 |
| 29 /** | 34 /** |
| 30 * Namespace for this validator. | |
| 31 */ | |
| 32 validatorType: { | |
| 33 type: String, | |
| 34 value: 'validator' | |
| 35 }, | |
| 36 | |
| 37 /** | |
| 38 * Name of the validator to use. | 35 * Name of the validator to use. |
| 39 */ | 36 */ |
| 40 validator: { | 37 validator: { |
| 41 type: String | 38 type: String |
| 42 }, | 39 }, |
| 43 | 40 |
| 44 /** | 41 /** |
| 45 * True if the last call to `validate` is invalid. | 42 * True if the last call to `validate` is invalid. |
| 46 */ | 43 */ |
| 47 invalid: { | 44 invalid: { |
| 48 notify: true, | 45 notify: true, |
| 49 reflectToAttribute: true, | 46 reflectToAttribute: true, |
| 50 type: Boolean, | 47 type: Boolean, |
| 51 value: false | 48 value: false |
| 52 }, | 49 }, |
| 53 | 50 |
| 51 /** |
| 52 * This property is deprecated and should not be used. Use the global |
| 53 * validator meta singleton, `Polymer.IronValidatableBehaviorMeta` instead
. |
| 54 */ |
| 54 _validatorMeta: { | 55 _validatorMeta: { |
| 55 type: Object | 56 type: Object |
| 57 }, |
| 58 |
| 59 /** |
| 60 * Namespace for this validator. This property is deprecated and should |
| 61 * not be used. For all intents and purposes, please consider it a |
| 62 * read-only, config-time property. |
| 63 */ |
| 64 validatorType: { |
| 65 type: String, |
| 66 value: 'validator' |
| 67 }, |
| 68 |
| 69 _validator: { |
| 70 type: Object, |
| 71 computed: '__computeValidator(validator)' |
| 56 } | 72 } |
| 57 | |
| 58 }, | 73 }, |
| 59 | 74 |
| 60 observers: [ | 75 observers: [ |
| 61 '_invalidChanged(invalid)' | 76 '_invalidChanged(invalid)' |
| 62 ], | 77 ], |
| 63 | 78 |
| 64 get _validator() { | 79 registered: function() { |
| 65 return this._validatorMeta && this._validatorMeta.byKey(this.validator); | 80 Polymer.IronValidatableBehaviorMeta = new Polymer.IronMeta({type: 'validat
or'}); |
| 66 }, | |
| 67 | |
| 68 ready: function() { | |
| 69 this._validatorMeta = new Polymer.IronMeta({type: this.validatorType}); | |
| 70 }, | 81 }, |
| 71 | 82 |
| 72 _invalidChanged: function() { | 83 _invalidChanged: function() { |
| 73 if (this.invalid) { | 84 if (this.invalid) { |
| 74 this.setAttribute('aria-invalid', 'true'); | 85 this.setAttribute('aria-invalid', 'true'); |
| 75 } else { | 86 } else { |
| 76 this.removeAttribute('aria-invalid'); | 87 this.removeAttribute('aria-invalid'); |
| 77 } | 88 } |
| 78 }, | 89 }, |
| 79 | 90 |
| (...skipping 26 matching lines...) Expand all Loading... |
| 106 * | 117 * |
| 107 * @param {Object} value The value to be validated. | 118 * @param {Object} value The value to be validated. |
| 108 * @return {boolean} True if `value` is valid. | 119 * @return {boolean} True if `value` is valid. |
| 109 */ | 120 */ |
| 110 | 121 |
| 111 _getValidity: function(value) { | 122 _getValidity: function(value) { |
| 112 if (this.hasValidator()) { | 123 if (this.hasValidator()) { |
| 113 return this._validator.validate(value); | 124 return this._validator.validate(value); |
| 114 } | 125 } |
| 115 return true; | 126 return true; |
| 127 }, |
| 128 |
| 129 __computeValidator: function() { |
| 130 return Polymer.IronValidatableBehaviorMeta && |
| 131 Polymer.IronValidatableBehaviorMeta.byKey(this.validator); |
| 116 } | 132 } |
| 117 }; | 133 }; |
| OLD | NEW |