Name Last Update
..
demo Loading commit data...
test Loading commit data...
.bower.json Loading commit data...
.gitignore Loading commit data...
.travis.yml Loading commit data...
CONTRIBUTING.md Loading commit data...
README.md Loading commit data...
bower.json Loading commit data...
hero.svg Loading commit data...
index.html Loading commit data...
iron-input.html Loading commit data...

README.md

Build Status

Demo and API Docs

##<iron-input>

<iron-input> adds two-way binding and custom validators using Polymer.IronValidatorBehavior to <input>.

Two-way binding

By default you can only get notified of changes to an input's value due to user input:

<input value="{{myValue::input}}">

iron-input adds the bind-value property that mirrors the value property, and can be used for two-way data binding. bind-value will notify if it is changed either by user input or by script.

<input is="iron-input" bind-value="{{myValue}}">

Custom validators

You can use custom validators that implement Polymer.IronValidatorBehavior with <iron-input>.

<input is="iron-input" validator="my-custom-validator">

Stopping invalid input

It may be desirable to only allow users to enter certain characters. You can use the prevent-invalid-input and allowed-pattern attributes together to accomplish this. This feature is separate from validation, and allowed-pattern does not affect how the input is validated.

<!-- only allow characters that match [0-9] -->
<input is="iron-input" prevent-invalid-input allowed-pattern="[0-9]">