Multiple buttons

[cedricmessiant]

It would be great to be able to use multiple buttons in the form. Maybe we could pass them via children ?

[almet]

Sure! Do you want to work on a patch?

[cedricmessiant]

Yes, of course. It should be just as simple as to replace : <p><button type="submit">Submit</button></p> by { children ? children : <p><button type="submit">Submit</button></p> } (I just tested it). I may also add a test and some doc in README.md if this solution is OK for you.

[n1k0]

It should be just as simple as to replace

We'll need to expose the submit, change and error handlers so children can leverage them as well.

[cedricmessiant]

I use onClick handlers on children buttons (and I need to save formData on my parent component's state to be able to pass it to these handlers). It's mostly because I don't know if it is possible to know which submit button was clicked in the handleSubmit handler...

[n1k0]

I use onClick handlers on children buttons

I don't get it, so how do you get form validation?

[cedricmessiant]

In my use case, the form validation is made on the server side and for some buttons (e.g. a Cancel button), we don't want form validation). I agree it is an exception and we need to be able to validate the form in each button.

What do you mean by

expose the submit, change and error handlers so children can leverage them as well

?

[n1k0]

I'm just realizing that adding a button type=submit is enough to trigger the form submission, which triggers the validation anyway. So yeah, just being able to pass a submit button as a children is enough. Nice.

Could you take care of working on a patch?

[cedricmessiant]

The problem is that form validation happens after the click event on the button. Then I tried to set some flag in the state of my parent component and to use this flag in the onSubmit handler but when I do this, the values in my fields "dissapears" and so the validation fails. It's strange that setting the state on my parent component can have an effect on the fields... So maybe it's not a good idea to have multiple submit buttons.

I can work on the patch though. It will be useful to allow users to use their own markup for buttons instead of the default submit button.

[n1k0]

Fixed by #34

[maneeshbhunwal123]

I was not able to make the above solution work,
My use case is,
I want 2 submit buttons on my form. onclick of them, separate flows will be kicked in but both of them need the formdata, I tried the above approach but my non default button's onclick/onsubmit handler is not getting data. Is this feature currently supported?
Please help

[llamamoray]

@bhunwal please see the "Validate and submit form from external control" example in tips and tricks