$.post() doesn't send data as json but as x-www-form-urlencoded instead

Question

This one is really weird. I have multiple $.post() in the code, but there is one don't know why sends the json parameters as x-www-form-urlencoded instead and therefore doesn't work.

Here's the code:

$.post("/Route/SaveTransportProperties", { properties: JSON.stringify(propArray), currTravelBox: JSON.stringify(travelBoxObj), accessToken: getAccessToken()}, function(data)     {         //DO STUFF     }); 

The XHR looks like this in Firefox:

Any ideas why is this happening? I also enforced the type as 'json' but doesn't work either.

Answer 1

If you want to send the data as json then use the $.ajax function

You can specify type post and dataType json.

$.ajax({   url: "mydomain.com/url",   type: "POST",   dataType: "xml/html/script/json", // expected format for response   contentType: "application/json", // send as JSON   data: $.param( $("Element or Expression") ),    complete: function() {     //called when complete   },    success: function() {     //called when successful  },    error: function() {     //called when there is an error   }, }); 

Taken from ajax documentation

http://api.jquery.com/jQuery.ajax/

contentTypeString Default: 'application/x-www-form-urlencoded; charset=UTF-8' 

Answer 2

Because $.post() is for sending form-like requests. $.ajax is for sending whatever you want to. See contentType in $.ajax page for more information.

Quote:

When sending data to the server, use this content-type. Default is "application/x-www-form-urlencoded", which is fine for most cases. If you explicitly pass in a content-type to $.ajax() then it'll always be sent to the server (even if no data is sent). Data will always be transmitted to the server using UTF-8 charset; you must decode this appropriately on the server side.