Formik: Add optional onChange property to formik which will be called when fields change

Created on 5 Mar 2018  ·  3Comments  ·  Source: formium/formik

Feature

New feature, allow for an optional onChange property to be supplied to formik that would allow external notification of changes before things are submitted.

For instance, we often start out not needing to know about form values until they are submitted, but occasionally we do need to do additional things based on the values as they change. So Formik could allow us to pass in an additional onChange property which will be called whenever the values change. This would allow external systems to be called as needed.

Current Behavior

There is no way to notify about field changes until submitted.

Desired Behavior

Optionally it would be good to have the ability to notify about changes. This would allow certain fields to be monitored and enable updates based on changes.

Suggested Solutions

Add optional property onChange to formik. If a function is provided then it will be called with the latest values and formik bag every time any field changes.

onChange: (values: Values, formikBag: FormikBag) {
// I can be notified of the updated values and can use them
}

Additional Information


  • Formik Version: v1.0.0-alpha.2
  • React Version: any
  • TypeScript Version: any
  • CodeSandbox Link:
  • OS: any
  • Node Version: any
  • Package Manager and Version: any
Duplicate

Most helpful comment

@jaredpalmer The linked proposal was abandoned, but there are plenty of use cases for onChange. I think it's worth re-opening this. Here's one use case:

Filter form

A typical filter form doesn't have a submit button, but every interaction with selects, checkboxes, radios etc immediately update the UI. It's convenient to have an onChange as proposed above to update the UI.

All 3 comments

See #401

yes, #401 would be a nice way to handle that. It would make it easy to know when a specific value changed, etc. Thanks.

@jaredpalmer The linked proposal was abandoned, but there are plenty of use cases for onChange. I think it's worth re-opening this. Here's one use case:

Filter form

A typical filter form doesn't have a submit button, but every interaction with selects, checkboxes, radios etc immediately update the UI. It's convenient to have an onChange as proposed above to update the UI.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jonathonwpowell picture jonathonwpowell  ·  3Comments

PeerHartmann picture PeerHartmann  ·  3Comments

dearcodes picture dearcodes  ·  3Comments

ancashoria picture ancashoria  ·  3Comments

najisawas picture najisawas  ·  3Comments