1

I'm attempting to create a API connection and need to output html form data as a JSON array. But my current output doesn't match the API documentation.

I've managed to get to a point where I am outputting the form data into a JSON friendly format but trying to match the documentations format is causing me trouble. Here is a link to the documentation: https://developer.infusionsoft.com/docs/rest/#!/Contact/createContactUsingPOST

const isEmail = element => element.type === 'email';

const formToJSON = elements => [].reduce.call(elements, (data, element) => {

  if (isValidElement(element) && isValidValue(element)) {

    if (isEmail(element)) {
      data[element.name] = (data[element.name] || []).concat(element.value);
    } else {
      data[element.name] = element.value;
    }
  }

  return data;
}, {});

const handleFormSubmit = event => {

  event.preventDefault();
  const data = formToJSON(form.elements);
  dataContainer.textContent = JSON.stringify(data, null, "  ");

};

const form = document.getElementsByClassName('contact-form')[0];
form.addEventListener('submit', handleFormSubmit);
<form class="contact-form">
  <input type="email" placeholder="Email" name="email_addresses" required="required">
  <input type="submit" placeholder="submit" value="submit" name="submit">
</form>

Current output if it's an email field

  "email_addresses": [
    "test@test.com"
  ],

What output should look like.

"email_addresses": [
    {
      "email": "string",
      "field": "EMAIL1"
    }
  ],
  • 1
    Something like this ? data[element.name] = []; var item = {"email": undefined,"field": "EMAIL1"}; item.email = (data[element.name] || []).concat(element.value); data[element.name].push(item); In case there will be single array member. – Jan Sep 18 '19 at 09:00

1 Answers1

0

@Tom posted an answer in the comments that I tried.

data[element.name] = []; var item = {"email": undefined,"field": "EMAIL1"};
item.email = (data[element.name] || []).concat(element.value);
data[element.name].push(item);

Results in the following output

"email_addresses": [
    {
      "email": [
        "test@test.com"
      ],
      "field": "EMAIL1"
    }
  ],

Removing (data[element.name] || []).concat results in the expected output of:

"email_addresses": [
    {
      "email": "test@test.com",
      "field": "EMAIL1"
    }
  ],