1 2<!--- 3 4This README is automatically generated from the comments in these files: 5iron-input.html 6 7Edit those files, and our readme bot will duplicate them over here! 8Edit this file, and the bot will squash your changes :) 9 10The bot does some handling of markdown. Please file a bug if it does the wrong 11thing! https://github.com/PolymerLabs/tedium/issues 12 13--> 14 15[](https://travis-ci.org/PolymerElements/iron-input) 16 17_[Demo and API docs](https://elements.polymer-project.org/elements/iron-input)_ 18 19 20## <iron-input> 21 22`<iron-input>` adds two-way binding and custom validators using `Polymer.IronValidatorBehavior` 23to `<input>`. 24 25### Two-way binding 26 27By default you can only get notified of changes to an `input`'s `value` due to user input: 28 29```html 30<input value="{{myValue::input}}"> 31``` 32 33`iron-input` adds the `bind-value` property that mirrors the `value` property, and can be used 34for two-way data binding. `bind-value` will notify if it is changed either by user input or by script. 35 36```html 37<input is="iron-input" bind-value="{{myValue}}"> 38``` 39 40### Custom validators 41 42You can use custom validators that implement `Polymer.IronValidatorBehavior` with `<iron-input>`. 43 44```html 45<input is="iron-input" validator="my-custom-validator"> 46``` 47 48### Stopping invalid input 49 50It may be desirable to only allow users to enter certain characters. You can use the 51`prevent-invalid-input` and `allowed-pattern` attributes together to accomplish this. This feature 52is separate from validation, and `allowed-pattern` does not affect how the input is validated. 53 54```html 55<!-- only allow characters that match [0-9] --> 56<input is="iron-input" prevent-invalid-input allowed-pattern="[0-9]"> 57``` 58 59 60
){kind=link}