PolymerElements / iron-input

An input with data binding
https://webcomponents.org/element/PolymerElements/iron-input
33 stars 45 forks source link

if type is password cannot use allowed pattern #38

Closed TimWillis closed 8 years ago

TimWillis commented 9 years ago

The following only validates required, not the pattern.

                   <input  id="password" is="iron-input" type="password" name="password" required="true"
                           allowed-pattern="/^(?=.*[a-zA-Z0-9])(?=.*[_$@.])[a-zA-Z0-9_$@.]{6,20}$/">
masonlouchart commented 9 years ago

For now only the type number is supported. To force to use the allowed-pattern set the property prevent-invalid-input as true.

notwaldorf commented 8 years ago

I think this has been fixed since the issue was opened. Here is a jsbin that uses type="password", and prevents invalid input (like in the demo): http://jsbin.com/fekuxi/edit?html,output.

as @LM450N mentioned, the pattern is not used for validation -- it's just used to prevent other characters (see the docs: https://github.com/PolymerElements/iron-input/blob/master/iron-input.html#L71)

I think the "only the type="number" is supported" means that you can use prevent-invalid-input with just type="number", and it will still work.