Form submit button disabled after submit

[jermay]

Summary

After submitting the form using the default "submit" button the submit button is disabled and and cannot be resubmitted. On one hand this is good to prevent double submission, but on the other hand if the request fails- like invalid password on login- there is currently no way to reset the form state so it can be submitted again.

Steps to reproduce

1. Create a form with the default "Submit" button
2. Fill out the form and press submit

Current Behaviour

The Submit button is permanently disabled and cannot be resubmitted

Expected Behaviour

If the request fails there should be a way to clear the form state so the form can be resubmitted.

Possible Solutions

Add a formClear() function to the arguments of the onSubmit function- i.e.

onSubmit(data: FormDataReturned, utils: { formClear: () => void, etc }): void;

Other feedback

It would be more convenient for consumption if FormDataReturned returned the values as an object instead of an array. It could even be a generic so the type could be user defined. This would however be a breaking change.

[BillyG83]

hey @jermay do you want the inputs to be resettable like this?
https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_input_type_reset

I'm not sure why the form would fail if the regex is used correctly. We can add a reset button that would enable the input and submit... but from what i am reading its more that you want the form to reset only when your API fails.

Maybe it would be good to add a resetForm boolean that you or other users could set true if the response fails... but for me it would be easier and better to render a "Thanks for submitting" message on submit, then render a new Form if fail.

what do you think?

[jermay]

You could remove the form after submit then show it again if an error occurs, but I don't think that's how most login forms work. The Moralis login doesn't work that way either. Even just some way to programmatically re-enable the submit button would be helpful as you may have a form that creates some sort of object in the database like a TPS report that you want to submit multiple times without resetting the form at all.

https://www.loom.com/share/8d8083fb99104a73af7eb7989e9e9fe2

[BillyG83]

hmmmm ok @jermay programatically being able to set the submit button disabled state sounds a great solution @AbhinavMV can you pick this up when you have a moment