Method pauseValidation not working in my custom form template

[anjalikalsariya]

What is the current behavior?

• pauseValidation is not working.

My Code

/* Custom form template*/
const CustomFormTemplate = ({
  formDetails,
  submitDetails,
  formFields,
  name
}: FormTempateProps) => {
  const { handleSubmit, getState, reset, pauseValidation } = useFormApi();


  return(
    <Form name={name} form={formDetails} onSubmitCapture={handleSubmit} className="data-form" onChange={pauseValidation}>
      {formFields}
      <BgButton
        disabled={submitting}
        className="mr-10 m-t-25 text-white"
        bgColor="blue"
        size="middle"
        long={true}
        htmlType="submit"
      >
        submit
      </BgButton>
    </Form>
  );
};


/* Parent component */

      <FormRenderer
          schema={schema}
          onSubmit={(values) => saveData(values)}
          componentMapper={componentMapper}
          subscription={{ values: true }}
        >
          {({ formFields }) => (
            <CustomFormTemplate
              submitDetails={submitOperationDetails}
              formDetails={formOpertaionDetails}
              formFields={formFields}
              name='xyz'
            />
          )}
        </FormRenderer>

What is the expected behavior?

• PauseValidation should pause the validation.

[anjalikalsariya]

Hello,

Is there any update on that topic? I would appreciate any info since this thing is important in my project.

[rvsia]

What is your use case? @anjalikalsariya

I never used pause validation feature myself but maybe there is another alternative.

[anjalikalsariya]

Here is my use case:

My customer requirement is the validation should apply when clicking on the submit button only. But currently when users click on the field and do nothing and go out from the field then showing validation error.

So, I had thought, I would pause validation when rendering the form, and once the user clicks on the submit button I'll resume the validation

[rvsia]

@anjalikalsariya For that use case you could use submit validation: https://final-form.org/docs/react-final-form/types/FormProps#onsubmit Submission Errors

In onSubmit function you can return an object with errors.

[anjalikalsariya]

Thanks @rvsia

Currently, a validation error showing when onblur event fields and as well click the submit button. In data driven library submit validation is already working. My main need is the validation should not run during onBlur of fields. Validation should run only when I click the submit button.

[rvsia]

@anjalikalsariya In that case remove validation from fields and just keep it in the submit function.

[anjalikalsariya]

Yes, right now only that way is possible. I'll write custom validation instead of schema field validation.