How to disable submit button until all fields are filled in in reactjs with redux-forms. To be more specific i have a form that consists only from radio buttons. So for every question there is 5 radio buttons to choose from. And i want by submit button to be disabled until all question are answered.
3
- Possible duplicate of React.js: Disable button when input is emptylukas-reineke– lukas-reineke2018-05-02 17:41:22 +00:00Commented May 2, 2018 at 17:41
- Not duplicate, this is specific for redux form how to sync validate form on every changeMilos Mosovsky– Milos Mosovsky2018-05-02 17:45:00 +00:00Commented May 2, 2018 at 17:45
- kindly add your code snippet.Galeel Bhasha– Galeel Bhasha2018-05-02 17:48:07 +00:00Commented May 2, 2018 at 17:48
Add a comment |
1 Answer
You need to leverage sync validation as shown here https://redux-form.com/6.6.3/examples/syncvalidation/ this will validate whole form if it's valid and pass necessary props to the component https://redux-form.com/6.6.3/docs/api/props.md/
invalid, valid
Then you can just bind disabled={invalid}
I created a sandbox to better illustrate it
1 Comment
EricM
Additionally, you can still leverage
invalid and valid if you are using field level validation, which adapts as the user interacts with a field (as opposed to when the form is submitted)