Sending Json Array in POST request for JavaScript

Question

I am having trouble in sending a JSON array in an AJAX call. Following is my Code

var company_name = $('input#company_name').val();
var company_localname = $('input#company_localname').val();
var companytype = $('#companytype').val();

if (companytype == 'retailer') {
    var bank_name = $('input#bank_name').val();
    var account_title = $('input#account_title').val();
    var business_nature = $('input#business_nature').val();
    var gross_sales = $('input#gross_sales').val();
}

After getting all the values I am storing the data in Json like the following

var jsonArray = [];
jsonArray["company_name"] = company_name;
jsonArray["company_localname "] = company_localname;

if (companytype == 'retailer') {
    jsonArray["bank_name"] = bank_name;
    jsonArray["account_title"] = account_title;
    jsonArray["business_nature"] = business_nature;
    jsonArray["gross_sales"] = gross_sales;
}

Now for sending the jsonArray in Ajax call

$.ajax({
    url : url,
    type : "POST",
    dataType : 'json',
    contentType : 'application/json; charset=UTF-8',
    data : JSON.stringify(jsonArray),
    success : function(response) {
        //Some Code here
    }
});

Please help me sending data. Or tell me if I am making any mistake here. Thank you

Answer 1

In JavaScript / JSON arrays are 0 based indexed data structures. What you are using here is more like a Map:

var jsonArray = [];
jsonArray["company_name"]=company_name ;

In JavaScript you cannot use arrays like this (well you can, but it is probably not what you want). For a data structure like a map that maps strings to objects rather then an index to objects, just use an object.

Or in short: Use var jsonArray = {}; rather than var jsonArray = []; The {} will create an object that you can assign properties to like you did. And JSON.stringify will correctly translate this into a JSON string like this:

{ "property": value, "otherProperty", otherValue }

Answer 2

Do something like this.

$.ajax({
        url: url,
        type: "POST",
        dataType: 'json',
        contentType: 'application/json; charset=UTF-8', 
        data: JSON.parse(JSON.stringify(jsonArray)),
        success: function(response) {
           //Some Code here
     }
    });

Answer 3

The JSON.parse() method parses a string as JSON, optionally transforming the value produced by parsing. Read more about JSON.parse() method

The JSON.stringify() method converts a JavaScript value to a JSON string. Read more about JSON.stringify() method

Here simply you can send an array and Parse it in server side.

$.ajax({
    url : url,
    type : "POST",
    dataType : 'json',
    data : jsonArray,
    success : function(response) {
        //Some Code here
    }
});