question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

How to get `errors` in `onSubmit` callback?

See original GitHub issue

Bug, Feature, or Question?

Question

Current Behavior

Can not get errors in onSubmit callback

Desired Behavior

Get errors in onSubmit callback.

I want to display errors in a Dialog when user submit a form.

Suggested Solutions

Add a new onSubmitWithErrors prop, which does not break current implementation.

<Formik
   onSubmitWithErrors={(values, bag) => {
      if (bag.errors) {
         Toast.error(bag.errors)
     } else {
       // send values to server
    }
})
/>

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:16
  • Comments:6 (1 by maintainers)

github_iconTop GitHub Comments

11reactions
timomearacommented, Jan 26, 2018

here’s how i’m doing it

const loginUser = withFormik({
  handleSubmit: async (payload, {props, setSubmitting, setErrors}) => {
    try {
      const errors = await props.handleSubmit(payload);
      setSubmitting(false);
      setErrors(errors);
    } catch (e) {
      throw (e);
    }
  },
  displayName: 'LoginForm',
});
`
1reaction
jaredpalmercommented, Feb 22, 2018

This is not possible right now. handleSubmit does not get executed if there are any errors present.

Read more comments on GitHub >

github_iconTop Results From Across the Web

formik: onSubmit callback function: what parameters i can use
Save this question. Show activity on this post. So how Formik know what parameters to be passed to the callback.
Read more >
useForm - handleSubmit - React Hook Form
handleSubmit function will not swallow errors that occurred inside your onSubmit callback, so we recommend you to try and catch inside async request...
Read more >
Final Form Docs – `FormProps`
Asynchronous with a callback. Returns undefined , calls callback() with no arguments on success, or with an Object of submission errors on failure....
Read more >
Handling Forms - VeeValidate
If you have a submit listener on the Form component, vee-validate assumes you will be handling submissions via JavaScript (AJAX) and automatically calls...
Read more >
Submit Validation Example - Redux Form
The errors are displayed in the exact same way as validation errors created by Synchronous Validation, but they are returned from the onSubmit...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found