handleSubmit custom params

[vicasas]

If I have a form which has two buttons to submit, one of them is to save the progress and the other is to finish the form.

How can I submit with my own logic for each of the actions in the Formik onSubmit event?

The idea is that each button passes or is assigned a meta data to identify the type of click that the user made to apply the logic that corresponds to each submit.

But how is this done in practice?

I had thought to props handleSubmit to stop a parameter by clicking the button but it doesn't work ):

return (
  <Formik
    onSubmit={(values, formikProps, customProps) => {
        console.log(customProps) // should print partial or finish
    }}
  >
    {(handleSubmit) => (
    <input type='text' ...  />
    <button onClick={handleSubmit('partial')}>Save Progress</button>
    <button onClick={handleSubmit('finish')}>Finish</button>
    }
  <Formik>
)
```

[ypahalajani]

@vicasas

A sample solution here (link to codesandbox)

I had followed this (link to formik docs) when I had a similar use case at work.

I hope this helps!

[anderssonq]

bro, cant see your codebox!

[ypahalajani]

@anderssonq Please check now. It got deleted by mistake. It should be recovered now.

[anderssonq]

@anderssonq Please check now. It got deleted by mistake. It should be recovered now.

thank you bro, regards!

[bel0v]

I had a similar case where the form had 2 submit buttons with different effects. I ended up making a submitVariant form value that would be filled with pressing either button. So later I just looked up that value in onSubmit handler.