JSFiddle - React, Tailwind, and code Playground

by thewolff

HTML

<form id="foo-bar" >
      <input type="text" name="foo.bar" />
    </form>
    <form id="foo-bar-baz-qux" >
      <input type="text" name="foo.bar" />
      <input type="text" name="foo.baz.qux" />
      <input type="text" name="qux" />
      <input type="text" name="foo.baz.xxx" />
      <input type="text" name="foo.baz.qux" />
    </form>

JavaScript

function serializeForm(formID) {
	var serialized = {}
/*   serialized[formID] = {} */; 
  
  
	var form = document.querySelector("#" + formID);
  var inputs = Array.from(form.querySelectorAll('input'));
  
  
	inputs.forEach(function(input) {
  	var name = input.name;
    var nameTokens = name.split('.');
    var value = input.value;
  	    
  	    
  	    serialized[name] = value;
  })
}

serializeForm("foo-bar")