Form submission canceled because the form is not connected

1

I have created a form in react, but when user leaves the form (by clicking a cancel button), the form component is destroyed.

When that happens I get the following warning on my console:
Form submission canceled because the form is not connected

Obviously what is happening is that the browser was expecting a submission, but the form was destroyed before it got any submission. Is there any way of avoiding this warning? Could I be doing something wrong, or can I ignore the warning?

Thanks!

1 Like
2

Hi @ManasMahanand1,

It is really hard to help you if you do not share your code. You could try adding type=“button” to your cancel button and see if this works otherwise I would suggest share your code so someone here can see if it is something obvious. I hope this helps :slight_smile:

3

adding type=‘button’ worked.

Can’t share code because it is for a company…

But essentially I just had a normal react form with an onsubmit handler which added a profile to a database, but I reused the same form for updating profile and just added a cancel button that did history.push(’/’).

I guess browser doesn’t realise that the button is part of form unless you put type=‘button’? I just don’t want to ignore the solution as it just works, I would like to know little bit more about how that works.

I will share a stripped down version of the code that skips over details of the product itself so you guys may be able to help me figure that out