Formik: Don't validate onSubmit

[sepehr500]

Current Behavior

Can not determine if validate was fired from blur, change, or handleSubmit

Desired Behavior

detect what event fired validate

Suggested Solutions

pass a flag that says what event fired validate

Info

I need the ability to tell if validate was fired from handleSubmit so I can only validate onChange and onBlur. Is there a way to do this currently?

[jaredpalmer]

Validation is always run on submit.

[jaredpalmer]

Will need to think about how to do this. Can you explain the kind of form / UX you are trying to achieve?

[sepehr500]

This is in reference to #285 . It would give me the flexibility to have warnings by doing validation differently if the submit button was clicked.

[jeffgreco]

I have a similar desire to allow save on submit with invalid fields. It's a multi-page form where folks can save their progress and hop between pages, but they should be able to see errors while working.

For now, I've tweaked formik.tsx to allow submission regardless of validation result.

[jaredpalmer]

Duplicate of #126

[conatus]

Thanks very much for working on Formik. It's a great library.

However this functionality is something we would like and is not quite a duplicate of #126. We would like to be able to tell the difference between a validation that is the result of a blur or change and a validation that is the result of a submit.

This is because with a on submit validation failure we want to be able to scroll the user to the invalid field, while on blur and change we want to display the error and not run anything around scrolling. Currently I cannot work out a way to do this without a significant and ugly hack, so would appreciate this feature.

[semenerror]

Can not use state.isSubmitting to detect form submission in validate function because of react setState optimization. The value in state.isSubmitting is still false and will change only on render cycle.

[awakened23]

This would solve https://stackoverflow.com/questions/54475481/formik-how-to-show-an-additional-error-message-when-validation-fails-on-submit

[adamscybot]

I managed to get around this by wrapping <Form>

import React from 'react'
import { FormikFormProps, useFormikContext, Form as FormikForm } from 'formik'

export const Form = (props: FormikFormProps) => {
  const { errors, handleSubmit } = useFormikContext()

  return (
    <FormikForm
      onSubmit={e => {
        // PUT CUSTOM HANDLING HERE
        // Errors are accessible from context
       ...

        handleSubmit(e)
      }}
      {...props}
    />
  )
}

[anusuyanatrajan]

@jaredpalmer Is there a way to turn off validation when user submit the forms?