Serialize complex form to JSON object using jQuery Serialize complex form to JSON object using jQuery json json

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...');            }        }    }}


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.