How to convert FormData into Object then JSON.stringify that?

Question

How would I convert my FormData into an object than JSON.stringify that? I think a reason why my values in the API are not being populated with my data is because endpoint expects JSON data.

handleSubmit:

handleSubmit(event) {
      event.preventDefault();

      const data = new FormData(event.target);

      fetch('http://localhost:8080/seniorproject/addUser', {
        method: 'POST',
        body: data,
      });

      console.log(data);
    }

Form:

<form onSubmit={this.handleSubmit}>
          <label htmlFor="First Name">Enter First Name</label>
          <input id="firstName" name="firstName" type="text" />

          <label htmlFor="Last Name">Enter your Last Name</label>
          <input id="lastName" name="lastName" type="lastName" />

          <label htmlFor="studentID">Enter your student id</label>
          <input id="studentID" name="studentID" type="text" />

          <label htmlFor="Email">Enter your email</label>
          <input id="email" name="email" type="text" />

          <label htmlFor="Password">Enter your password</label>
          <input id="password" name="password" type="text" />

          <button>Send data!</button>
        </form>

may i know if u r importing redux-form ?

KOTIOS
– KOTIOS

2019-04-17 13:58:05 +00:00
Commented Apr 17, 2019 at 13:58 — KOTIOS
– KOTIOS, Commented Apr 17, 2019 at 13:58

Niekert · Accepted Answer · 2019-04-17 14:06:47Z

2

You could use the formData.entries() method to loop over all the entries in the FormData and construct a JSON object, like so:

const json = {};
Array.from(formData.entries()).forEach(([key, value]) => {
  json[key] = value;
})

JSON.stringify(json)

answered Apr 17, 2019 at 14:06

Niekert

9471 gold badge9 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to convert FormData into Object then JSON.stringify that?

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related