Skip to main content

Custom form controls

Sometimes we need use non-standard controls in our forms. Web Components, for example, don't work well with forms. Here is how to proceed:

  • When your custom control's value changes, call informEl.setValues() to update the value.
  • Wrap your custom control in a <inform-field> element and set the name attribute on the <inform-field> element itself.
  • Validate using informEl.validationHandler, the value set with informEl.setValues() above will be passed as input, and the <inform-field> element added in the previous step will display the error.

Here is an example:

The "lastName" field consists of 2 buttons, one setting a valid value, the other one an invalid value.