This time I will share jQuery Plugin and tutorial about Serializing Forms To JSON Objects – jQuery serializeObject, hope it will help you in programming stack.
The serializeObject provides an additional method for jQuery that has the ability to serialize your form values to complex JSON objects.
How to use it:
1. Download and include the minified version of the jQuery serializeObject plugin after jQuery.
1 |
<script src="//code.jquery.com/jquer.min.js"></script> |
2 |
<script src="jquery.serializeObject.min.js"></script> |
2. Note that your form fields must have name attribute as these:
1 |
<input type="text" name="username"> |
2 |
<select name="education"> |
3 |
<option value="Jr.High">Jr.High</option> |
4 |
<option value="HighSchool">HighSchool</option> |
5 |
<option value="College">College</option> |
3. Create a container to display the serialized form data.
4. The JavaScript to output the serialized data in the ‘result’ container.
1 |
$('form').submit(function() { |
2 |
$('#result').text(JSON.stringify($('form').serializeObject())); |
This awesome jQuery plugin is developed by hongymagic. For more Advanced Usages, please check the demo page or visit the official website.
