Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Method pauseValidation not working in my custom form template #1435

Open
anjalikalsariya opened this issue Jan 5, 2024 · 7 comments
Open

Comments

@anjalikalsariya
Copy link

anjalikalsariya commented Jan 5, 2024

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
Copy link
Author

anjalikalsariya commented Jan 9, 2024

Hello,

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

@rvsia
Copy link
Contributor

rvsia commented Jan 25, 2024

What is your use case? @anjalikalsariya

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

@anjalikalsariya
Copy link
Author

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
Copy link
Contributor

rvsia commented Jan 26, 2024

@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
Copy link
Author

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
Copy link
Contributor

rvsia commented Jan 26, 2024

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

@anjalikalsariya
Copy link
Author

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants