Improve <SubmitButton/> disabled behavior or improve documentation
suarez-agu opened this issue · comments
Using
formik-antd 2.0.0-beta.3
formik 2.1.4
antd 4.0.0
When setting values in required fields, the submit button will enable even if there are other required fields without any values in them
You can try it here in the "Sample Form" page.
https://codesandbox.io/s/keen-franklin-wpefu
Fill out first name, the submit button will enable itself although lastname is required
I think this is by design. The lastname field has not been touched (lets assume it might have been overlooked by the user). In this case validation errors are not rendered for this component (only touched fields with validation errors actually show the errors).
In this case the submit button is enabled to allow triggering submit which in my opinion should rerun validation (either client side or server side). Then the user will get feedback whats wrong.
If the Submit button would be disabled, the user would not necessarily know what is wrong (as said in this case he just overlooked the lastname) and does not have a clear way to solve the issue (no feedback is visible that can guide him).
That is why the submit button will only disable if the field has been touched (touching a field will render validation feedback).
There are several (closed) issues regarding this topic and also the documentation is not clear on this.
I will leave this issue open to either improve the documentation or improve the behavior (feel free to come up with ideas).
You raise a good point.
I found this stackexchange question which tackles that question. It seems that the way the was designed is similar to that.
https://ux.stackexchange.com/questions/76301/form-validation-and-disabled-buttons
We could leave it as is and I can update the documentation if needed.