CODEWITHSUNDEEP
javascriptreact-adminreact-final-formfinal-form
Guybrush
Guybrush

Reputation: 31

React Admin - How to disable validation onChange

I'm using react-admin, and I have a huge form, with a bunch of custom validation. It's very slow, even with the build version.

I tried to find a way to disable the validation on change and to have it only on blur or submit. But I have not found a solution or even workaround.

Every time a key is pressed in one of my input text (for example), the validation is triggered multiple times, and it takes a while for the letter to appear.

That's why I want to disable the validation on change.

Here's an example of one of my forms, every letter I write in one of my FormTab, the "validate me" is showing.

export const ThemeCreate: FC = (props: any) => (
  <Create {...props} title="ui.themes.create" mutationMode="pessimistic">
    <TabbedForm
      toolbar={<GenericCreateToolbar />}
      validateOnBlur
      warnWhenUnsavedChanges
      validate={() => {
        console.log('validate me!');
      }}
    >
      <MainFormTab />
      <TranslationsFormTab />
    </TabbedForm>
  </Create>
);

Upvotes: 2

Views: 1683

Answers (1)

lifeisfoo
lifeisfoo

Reputation: 16294

You need to use the validateOnBlur={true} prop in the form component.

This prop is from final-form's <Form> component, see the last one in this doc page https://final-form.org/docs/react-final-form/types/FormProps

Upvotes: -1

Related Questions