Skip to content
Encode a set of form elements as a JSON object for manipulation/submission.
JavaScript HTML
Branch: master
Clone or download
hongymagic Merge pull request #17 from Erikvv/feature/add-typescript-definition
Add a typescript definition for the library
Latest commit 7dbebed Jun 15, 2017
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist Remove camel casing of keys as suggested by issue #2 Jan 23, 2013
test Replace git submodules and use bower dependencies instead May 15, 2014
.bowerrc Replace git submodules and use bower dependencies instead May 15, 2014
.gitignore Replace git submodules and use bower dependencies instead May 15, 2014
.gitmodules Replace git submodules and use bower dependencies instead May 15, 2014
.jshintrc Add grunt task Jan 22, 2013
.travis.yml Replace git submodules and use bower dependencies instead May 15, 2014
Gruntfile.js Add grunt support Apr 16, 2013
LICENSE.txt Add LICENSE file via addalicense.com Oct 2, 2013
README.markdown docs: add known issues section in readme Nov 26, 2015
bower.json
jquery.serializeObject.d.ts Add a typescript definition for the library Jun 14, 2017
jquery.serializeObject.js
package.json Add a typescript definition for the library Jun 14, 2017
serializeObject.jquery.json 2.0.3 Oct 2, 2013

README.markdown

Build Status

What is it?

$.serializeObject is a variant of existing $.serialize method which, instead of encoding form elements to string, converts form elements to a valid JSON object which can be used in your JavaScript application.

Why?

Whilst it isn't necessary in most cases, and by that I mean 99.99% kind of most, there are times when we manipulate form data on client side. Personally I find JSON much easier to work with than DOM or string manipulation.

How do I use it?

If you want to see the code and demo first: http://jsfiddle.net/davidhong/PRpJT/

Simply include the jQuery.serializeObject.js along with any jQuery instance and use it like $.serialize.

If you have a form like the following:

<form id="minutes">
	<input type="text" name="subject">
	<input type="text" name="minute-taker">
	<!-- ... -->
	<input type="checkbox" name="attendees" value="David" checked="checked">
	<input type="checkbox" name="attendees" value="Daniel" checked="checked">
	<input type="checkbox" name="attendees" value="Darwin" checked="checked">
</form>

and wish to convert them to a JSON object:

var minutes = $('form#minutes').serializeObject();

will return:

{
	"subject": "",
	"minute-taker": "",
	"attendees": [
		"David",
		"Daniel",
		"Darwin"
	]
}

Change log

2.0.3

  • Add MIT License

2.0.2

  • Add support for $.noConflict mode

2.0.0

Major version change: Camel casing of names have been removed. Please use version 1.0.4 if you require camel casing of names.

  • Remove $.data like camelCasing on names

1.0.4

  • Fix an issue (#2) where arrays longer than 2 resulted in incorrect values

Known issues

Bitdeli Badge

You can’t perform that action at this time.