useFormik - onChange Not Firing

[bradleyjdavid]

So, I have some React Bootstrap drop downs (select-options) and text boxes that I want triggered onChange. What's the proper way to handle them from within the useFormik initialization, because the onChange function doesn't seem to be hooked up properly?

const formik = useFormik({
    initialValues: {...},
    validationSchema: Yup.object.shape({...}),
    onSubmit: values => {
        alert('This this works!');
    },
    onChange: values => {
        alert('This alert isn't firing');
});

...

<Form onSubmit={formik.handleSubmit} id="signUpForm">

...

    <Form.Control
        type="text"
        placeholder={'Full Name'}
        name="fullName"
        value={formik.values.fullName}
        onChange={formik.handleChange}
        isValid={formik.touched.fullName && !formik.errors.fullName}
        isInvalid={!!formik.errors.fullName}
    />

...

[johnrom]

Formik doesn't have an onChange property, Fields do. Please read the documentation, search the issues, ask on Discord, and open an issue with a codesandbox of your attempts to implement the functionality you are looking for if your question hasn't been answered.

Probably related:

#2244
#2204
#1633

[maddhruv]

Hey @bradleyjdavid useFormik(config: FormikConfig) doesn't accept any config as onChange and that is why it is not triggered 😉

While you can add onChange handler on the Field component and render the react bootstrap component inside of it, ref - https://formik.org/docs/api/field#rendering

[KTPenrose]

I read the documentation and I still have no idea how to do it. I tried the following, but it still doesn't work.

function goofyOnChange() { console.log("goofyOnChange()"); } ...
<Field name='myfield' onChange={goofyOnChange}> ...