Serialize complex form to JSON object using jQuery
Try this code I wrote for you... Works fine for me, just using your data result. You can work on it and make a simple jQuery plugin...
The sample need JSON.stringify to work fully.
var d = { 'name': 'name value', 'phone[0][type]': 'cell', 'phone[0][number]': '000', 'phone[1][type]': 'home', 'phone[1][number]': '111',};$(document).ready(function(){ arrangeJson(d); alert(JSON.stringify(d));});function arrangeJson(data){ var initMatch = /^([a-z0-9]+?)\[/i; var first = /^\[[a-z0-9]+?\]/i; var isNumber = /^[0-9]$/; var bracers = /[\[\]]/g; var splitter = /\]\[|\[|\]/g; for(var key in data) { if(initMatch.test(key)){ data[key.replace(initMatch,'[$1][')] = data[key]; } else{ data[key.replace(/^(.+)$/,'[$1]')] = data[key]; } delete data[key]; } for (var key in data) { processExpression(data, key, data[key]); delete data[key]; } function processExpression(dataNode, key, value){ var e = key.split(splitter); if(e){ var e2 =[]; for (var i = 0; i < e.length; i++) { if(e[i]!==''){e2.push(e[i]);} } e = e2; if(e.length > 1){ var x = e[0]; var target = dataNode[x]; if(!target){ if(isNumber.test(e[1])){ dataNode[x] = []; } else{ dataNode[x] ={} } } processExpression(dataNode[x], key.replace(first,''), value); } else if(e.length == 1){ dataNode[e[0]] = value; } else{ alert('This should not happen...'); } } }}
There is also the following library
This worked very well for me. This doesn't need to have the form2js library.
$.fn.serializeObject = function serializeObject() { var o = {}; var a = this.serializeArray(); $.each(a, function () { if (o[this.name] !== undefined) { if (!o[this.name].push) { o[this.name] = [o[this.name]]; } o[this.name].push(this.value || ''); } else { o[this.name] = this.value || ''; } }); return o; };
To serialise the form data I used this code then.
JSON.stringify($(this).serializeObject());//'this' points to the form
If you have any doubts please feel free to add comment.