CODEWITHSUNDEEP
javascriptjqueryjson
Jason
Jason

Reputation: 13956

JQuery Post sends form data and not JSON

Trying to send json. Here's my function:

var object = ... ;

$.ajax({
      type: 'POST',
      url: '<url>',
      contentType: 'application/json; charset=utf-8',
      dataType: 'json',
      data: object
    });

But whenever I check Chrome, it always sends it as query params:

Request Payload:
startDate=Wed+Dec+19+2012+19%3A00%3A00+GMT-0500+(EST)&endDate=Thu+Dec+20+2012+19%3A00%3A00+GMT-0500+(EST)&

How do I get it to send as JSON?

Upvotes: 50

Views: 36558

Answers (3)

Stefan
Stefan

Reputation: 14863

With JSON.stringify(object)

Sample:

$.ajax({
    type: 'POST',
    url: '<url>',
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    data: JSON.stringify(object)
});

Note JSON.stringify is not supported in all browsers (http://caniuse.com/#feat=json ), in particular browsers IE7 and lower.

If you need to support this browsers too you can use this Javascript library: https://github.com/douglascrockford/JSON-js

Upvotes: 88

closure
closure

Reputation: 7452

I have found it easier to send data in default 'application/x-www-form-urlencoded' format with JSON as a field like this:

$.ajax({
    type: 'POST',
    url: '<url>',
    dataType: 'json',
    data: {json:JSON.stringify(object)}
});

On server use the regular method to receive field called json.

Just shared to see if this is valid for you.

Upvotes: -2

UltraInstinct
UltraInstinct

Reputation: 44424

Stringify using JSON.stringify(object)

Modify the data field to:

...
data: JSON.stringify(object),
...

The way you are doing it, IMO, jQuery sees the parameter as a dictionary (key-value pairs), and constructs a percentile-encoded string from that; and hence you see that output.

Upvotes: 5

Related Questions