Question about the conditions under which onSubmitInvalid is called

[YESHYUNGSEOK]

Currently, the onSubmitInvalid callback is not triggered every time the fields are invalid at the moment of submission, but only once at the initial attempt. To have it triggered every time, you need to pass canSubmitWhenInvalid={true} as a prop (it actually took me quite a bit of digging to find out that this prop even exists). By default, this value is set to false.

From my personal perspective, I would expect onSubmitInvalid to be called on every submit attempt whenever the form is invalid. Is there a specific design reason behind why it only works this way by default?

[LeCarbonator]

You are likely experiencing problems that this PR solves: #1697

[YESHYUNGSEOK]

@LeCarbonator

Thank you for the answer, but the point is that FormApi already provides canSubmitWhenInvalid={true} to handle this issue. I’m curious why that PR would be necessary.

If the expected default behavior is for onSubmitInvalid to be called on every failed submit attempt, wouldn’t it be enough to simply set the default value of the canSubmitWhenInvalid prop to true?

I’d love to hear your thoughts on this!

[YESHYUNGSEOK]

Oh! The PR you shared actually answers the questions I had. I hadn’t noticed it before — thanks a lot for pointing it out 😄

For reference, I solved this issue by passing the canSubmitWhenInvalid={true} prop and then performing a synchronous validation before handleSubmit to update the latest errors.

[LeCarbonator]

Yeah, the idea is that

• canSubmitWhenInvalid: true ignores canSubmit's state and will rerun validation first.
• canSubmitWhenInvalid: false does an early return because the errors are already present.

onSubmitInvalid is just to tell you when the submission failed, and the early return is one of those cases.