serbanghita/form-to-object.js

Plain JavaScript method to convert a HTML form (fields and values) to JavaScript (multidimensional) object.

2.0.0 2018-04-06 22:28 UTC

README

Build Status NPM package NPM downloads

Convert HTML forms with all their fields and values to multi-dimensional JavaScript objects

Install

Node.js

  • npm install form_to_object

Browser

<!-- Include minified script (~2kb) -->
<script src="dist/formToObject.min.js"></script>

Usage

Using the DOM node id.

formToObject('myFormId');

Using the actual DOM Node reference.

formToObject(document.getElementById('myFormId'));

Result

{
  saveSettings: 'Save',
  name: 'Serban',
  race: 'orc',
  settings: {
     input: 'keyboard',
     video: {
        resolution: '1024x768',
        vsync: 'on'
     }
  }
}

XHR - sending form data

$.ajax({
  'url': '/app/settings/save/',
  'type': 'post',
  'data': formToObject('saveSettingsForm'),
  'success': function(r){}
});
Browser support

IE 8, Firefox 3.5, Chrome, Safari, Opera 10, every mobile browser.

Screenshot