T
TanStack•5mo ago
flat-fuchsia

Activate onChange validation only after submitting once?

useForm({
...
    validators: {
      onChange: ({ formApi }) =>
        formApi.state.submissionAttempts > 0 ? loginSchema : undefined,
      onSubmit: loginSchema,
...
useForm({
...
    validators: {
      onChange: ({ formApi }) =>
        formApi.state.submissionAttempts > 0 ? loginSchema : undefined,
      onSubmit: loginSchema,
...
this doesn't seem to work
3 Replies
ratty-blush
ratty-blush•5mo ago
this is assigned once on mount, in which case it's always going to be false. you'll have to manually write the login schema safeParse if you want it to act conditionally
flat-fuchsia
flat-fuchsiaOP•5mo ago
is there a way to achieve the same StandardSchema behaviour conditionally? As in not having to manually return the error object? I got it to work but it seems hacky 
useForm({
    ...
    validators: {
      onChange: ({ value, formApi }) => {
        if (formApi.state.submissionAttempts > 0) {
          return standardSchemaValidators.validate(
            {
              value,
              validationSource: "form",
            },
            loginSchema
          );
        }
        return undefined;
      },
      onSubmit: loginSchema,
    ...
useForm({
    ...
    validators: {
      onChange: ({ value, formApi }) => {
        if (formApi.state.submissionAttempts > 0) {
          return standardSchemaValidators.validate(
            {
              value,
              validationSource: "form",
            },
            loginSchema
          );
        }
        return undefined;
      },
      onSubmit: loginSchema,
    ...
I think there should be a better example of using standardSchemaValidators I might make a PR for the example
equal-aqua
equal-aqua•5mo ago
Why do you want to do that? Maybe you could just show the errors conditionally (submissionAttempts > 1)?

Did you find this page helpful?