I'm currently learning the MERN stack and I'm very new to React and Express. My current task is to use an API I previously created and update the JSON data using React.
I created a form component using ReactStrap and now I need POST that data to the JSON object…
Latest comments (2)
The reason you get the error
is because the parameter it expects is a form element.
I can see you have
const form = useRef(null);
, but I can't see anywhere that you actually set that reference to yourform
. You need to useforwardRef
in yourWebForm
component to target theform
.This way you can them put a ref on your component to gain access to the form element nested within it. Assuming you've forwarded the ref, you can then write
<WebForm ref={form} ... />
which should then ensure your submit function gets all the form data when submitting to your endpoint.When you create an instance of FormData you need to append data to the formData object. I have seen your issue on Stack overflow.
Use this solution
On your Nodejs server, if you're not sending a file along with your form, do not send form data content-type to the server. Use json instead