@mstyk/iron-validatable-behavior

Provides a behavior for an element that validates user input

Usage no npm install needed!

<script type="module">
  import mstykIronValidatableBehavior from 'https://cdn.skypack.dev/@mstyk/iron-validatable-behavior';
</script>

README

Build status

Demo and API docs

Polymer.IronValidatableBehavior

Use Polymer.IronValidatableBehavior to implement an element that validates user input. Use the related Polymer.IronValidatorBehavior to add custom validation logic to an iron-input.

By default, an <iron-form> element validates its fields when the user presses the submit button. To validate a form imperatively, call the form's validate() method, which in turn will call validate() on all its children. By using Polymer.IronValidatableBehavior, your custom element will get a public validate(), which will return the validity of the element, and a corresponding invalid attribute, which can be used for styling.

To implement the custom validation logic of your element, you must override the protected _getValidity() method of this behaviour, rather than validate(). See this for an example.

Accessibility

Changing the invalid property, either manually or by calling validate() will update the aria-invalid attribute.