| OLD | NEW |
| 1 <!-- | 1 <!-- |
| 2 @license | 2 @license |
| 3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. | 3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. |
| 4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt | 4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt |
| 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt |
| 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt |
| 7 Code distributed by Google as part of the polymer project is also | 7 Code distributed by Google as part of the polymer project is also |
| 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt | 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt |
| 9 --> | 9 --> |
| 10 | 10 |
| (...skipping 23 matching lines...) Expand all Loading... |
| 34 | 34 |
| 35 <input is="iron-input" validator="my-custom-validator"> | 35 <input is="iron-input" validator="my-custom-validator"> |
| 36 | 36 |
| 37 ### Stopping invalid input | 37 ### Stopping invalid input |
| 38 | 38 |
| 39 It may be desirable to only allow users to enter certain characters. You can use
the | 39 It may be desirable to only allow users to enter certain characters. You can use
the |
| 40 `prevent-invalid-input` and `allowed-pattern` attributes together to accomplish
this. This feature | 40 `prevent-invalid-input` and `allowed-pattern` attributes together to accomplish
this. This feature |
| 41 is separate from validation, and `allowed-pattern` does not affect how the input
is validated. | 41 is separate from validation, and `allowed-pattern` does not affect how the input
is validated. |
| 42 | 42 |
| 43 <!-- only allow characters that match [0-9] --> | 43 <!-- only allow characters that match [0-9] --> |
| 44 <input is="iron-input" prevent-invaild-input allowed-pattern="[0-9]"> | 44 <input is="iron-input" prevent-invalid-input allowed-pattern="[0-9]"> |
| 45 | 45 |
| 46 @hero hero.svg | 46 @hero hero.svg |
| 47 @demo demo/index.html | 47 @demo demo/index.html |
| 48 */ | 48 */ |
| 49 | 49 |
| 50 Polymer({ | 50 Polymer({ |
| 51 | 51 |
| 52 is: 'iron-input', | 52 is: 'iron-input', |
| 53 | 53 |
| 54 extends: 'input', | 54 extends: 'input', |
| (...skipping 92 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 147 // What a control/printable character is varies wildly based on the browse
r. | 147 // What a control/printable character is varies wildly based on the browse
r. |
| 148 // - most control characters (arrows, backspace) do not send a `keypress`
event | 148 // - most control characters (arrows, backspace) do not send a `keypress`
event |
| 149 // in Chrome, but the *do* on Firefox | 149 // in Chrome, but the *do* on Firefox |
| 150 // - in Firefox, when they do send a `keypress` event, control chars have | 150 // - in Firefox, when they do send a `keypress` event, control chars have |
| 151 // a charCode = 0, keyCode = xx (for ex. 40 for down arrow) | 151 // a charCode = 0, keyCode = xx (for ex. 40 for down arrow) |
| 152 // - printable characters always send a keypress event. | 152 // - printable characters always send a keypress event. |
| 153 // - in Firefox, printable chars always have a keyCode = 0. In Chrome, the
keyCode | 153 // - in Firefox, printable chars always have a keyCode = 0. In Chrome, the
keyCode |
| 154 // always matches the charCode. | 154 // always matches the charCode. |
| 155 // None of this makes any sense. | 155 // None of this makes any sense. |
| 156 | 156 |
| 157 var nonPrintable = | 157 // For these keys, ASCII code == browser keycode. |
| 158 var anyNonPrintable = |
| 158 (event.keyCode == 8) || // backspace | 159 (event.keyCode == 8) || // backspace |
| 160 (event.keyCode == 13) || // enter |
| 161 (event.keyCode == 27); // escape |
| 162 |
| 163 // For these keys, make sure it's a browser keycode and not an ASCII code. |
| 164 var mozNonPrintable = |
| 159 (event.keyCode == 19) || // pause | 165 (event.keyCode == 19) || // pause |
| 160 (event.keyCode == 20) || // caps lock | 166 (event.keyCode == 20) || // caps lock |
| 161 (event.keyCode == 27) || // escape | |
| 162 (event.keyCode == 45) || // insert | 167 (event.keyCode == 45) || // insert |
| 163 (event.keyCode == 46) || // delete | 168 (event.keyCode == 46) || // delete |
| 164 (event.keyCode == 144) || // num lock | 169 (event.keyCode == 144) || // num lock |
| 165 (event.keyCode == 145) || // scroll lock | 170 (event.keyCode == 145) || // scroll lock |
| 166 (event.keyCode > 32 && event.keyCode < 41) || // page up/down, end, ho
me, arrows | 171 (event.keyCode > 32 && event.keyCode < 41) || // page up/down, end, ho
me, arrows |
| 167 (event.keyCode > 111 && event.keyCode < 124); // fn keys | 172 (event.keyCode > 111 && event.keyCode < 124); // fn keys |
| 168 | 173 |
| 169 return !(event.charCode == 0 && nonPrintable); | 174 return !anyNonPrintable && !(event.charCode == 0 && mozNonPrintable); |
| 170 }, | 175 }, |
| 171 | 176 |
| 172 _onKeypress: function(event) { | 177 _onKeypress: function(event) { |
| 173 if (!this.preventInvalidInput && this.type !== 'number') { | 178 if (!this.preventInvalidInput && this.type !== 'number') { |
| 174 return; | 179 return; |
| 175 } | 180 } |
| 176 var regexp = this._patternRegExp; | 181 var regexp = this._patternRegExp; |
| 177 if (!regexp) { | 182 if (!regexp) { |
| 178 return; | 183 return; |
| 179 } | 184 } |
| (...skipping 48 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 228 } | 233 } |
| 229 | 234 |
| 230 }); | 235 }); |
| 231 | 236 |
| 232 /* | 237 /* |
| 233 The `iron-input-validate` event is fired whenever `validate()` is called. | 238 The `iron-input-validate` event is fired whenever `validate()` is called. |
| 234 @event iron-input-validate | 239 @event iron-input-validate |
| 235 */ | 240 */ |
| 236 | 241 |
| 237 </script> | 242 </script> |
| OLD | NEW |