onSubmit is required

[juliohenderson]

Is there any reason why onSubmit is required? If I am going to do a custom submission by ValidatorForm methods, I will have console errors onSubmit is required

[NewOldMax]

Why not to do custom submission by onSubmit function?

[NewOldMax]

When you use form, it should be submitted, right? It's designed to be submitted so you must provide onSubmit What's the problem?

[juliohenderson]

My root problem is, it is not possible to have one form inside another because the child submit also sends the parent when they click the button, because both forms have onSubmit in the form. So the child form I'm using ref and using ValidatorForm's method. `setRef = ref => { this.refForm = ref; };

validationForm = event => { if (event) { event.preventDefault(); event.persist(); } this.refForm.errors = []; new Promise(resolve => { resolve(this.refForm.walk(this.refForm.childs)); }).then(result => { if (this.refForm.errors.length) { this.refForm.props.onError(this.refForm.errors); } if (result) { this.submitForm(); } return result; }); };

submitForm = () => this.props.sendCommission(this.props.quoteId, [this.props.record]);`

<ValidatorForm ref={ref => this.setRef(ref)}> ` <Button variant="contained" color="primary" type="submit" onClick={e => { this.validationForm(e); }}

Salvar `

[NewOldMax]

Can you reproduce your issue at https://codesandbox.io/s/new ?

[DeepakM02]

is it possible to use nested validator form ? Because when i put one form inside another so one form submit is working so do you have any solution ?

[NewOldMax]

@DeepakM02 you should avoid nested forms

[juliohenderson]

Hello @DeepakM02 I managed to do this as follows, I created a gist to make it easier. https://gist.github.com/juliohenderson/664f0433e3e96f567ed2129e5aed3e10

You will be alerted on the console that "prop onSubmit is required on ValidatorForm" but you can handle this by entering "onSubmit = () => console.log ()" or something similar

[DeepakM02]

Hey @juliohenderson this shows "warning.js: Warning: validateDOMNesting(...) cannot appear as a descendant of

"

[DeepakM02]

@DeepakM02 you should avoid nested forms

Hello @NewOldMax If we have this type of situation that if we have form inside form(nested) and their submit trigger btn is different so how it is possible to validate both form.

[NewOldMax]

@DeepakM02 you should rethink your solution, it's a bad approach, even html5 says that you shouldn't use nested forms. Of course you can do whatever you want, but it's on your risk and it's not designed for that.

[juliohenderson]

@NewOldMax is right, I had the same problem and solved as I could because refactoring in my case would be very laborious and would not have time for it. @DeepakM02 I did not get this error, it may be caused by something specific you are doing. If your work to refactor is not great, do so.

[juliohenderson]

As I did, your parent form looks like the ValidatorForm documentation says to do. And the child form will look the way I did in gist. If you want to put your code in a gist for us to look at, feel free to.

[NewOldMax]

closed due no activity