HTMLCollection() Values and Names to JSON

Question

Problem:

Two forms, in hidden divs, which appear when you press the coressponding button. The Input gets parsed to JSON and sent with a request. I can't use form or fieldset to wrap around the form for different reasons, so I used:

form = document.getElementById('formularEins').getElementsByTagName('input');

When I was still able to use form.elements (before I realised that the .elements property is not supported on fieldsets by IE) I used this to generate JSON from the input:

(In this case form = document.getElementsByClassName('formOne')[0];

Const formToJSON = elements => [].reduce.call(elements, (data, element) => {
    if (isCheckbox(element)) {
    //data[element.name] = (data[element.name] || []).concat(element.value);
    data[element.name] = element.value;
  } else if (isMultiSelect(element)) {
    data[element.name] = getSelectValues(element);
  } else {
    data[element.name] = element.value;
  }
}
return data;
},);

Question:

How can you convert the Input to JSON for a HTMLCollection and its items like above?

I tried - and failed with different versions of the following:

   var formToJSON = function formToJSON(form) {
       for (var i = 0; i < form.length; i++) {
       var item = form[i]; 
       data[item.name] = item.value; }
   };

Answer 1

You have to define data variable as object. Try following formToJSON function.

var formToJSON = function(form) {
  var data = {};
  for (var i = 0; i < form.length; i++) {
    var item = form[i];
    data[item.name] = item.value;
  }
  return data;
}