Skip to main content

Listening for changes

<inform-el /> exposes the following events

  • inform-input: similar to the native input event
  • inform-change: similar to the native change event

Both events contain a detail field, which is an object with the following fields:

  • values : the current form values.
  • changedField: the name of the field that changed.

Here is an example:

First Name
<input type="text" name="firstName" />
Last Name
<input type="text" name="lastName" />
<button type="submit">Submit</button>

document.querySelector('inform-el').addEventListener('inform-input', ({ detail: { values, changeField } }) => {
// After typing 'a' in "First Name":
console.log('Values:', values); // {firstName: 'a', lastName: ''}
console.log('Changed field:', changeField); // "firstName"