$.post() behaves different than $.ajax( same paramenters )

Question

I came across something weird, that I want to expose and know if someone as an explanation for it.

Some time back i had a simple post:

$.post("/Route/Save", { myObj: JSON.stringify(myObj), accessToken: getAccessToken()}, function(data)
{
    //do stuff
});

and it was working nicely, now doesn't work, and only the accessToken paramenter is correctly received in the route controller

I changed it to:

$.ajax({
    url: "/Route/Save",
    data: '{ myObj:' +  JSON.stringify(myObj) + ',accessToken:"' + getAccessToken()+'"}',
    type: 'POST',
    datatype: 'JSON',
    contentType: 'application/json',
    success: function (data)
    {
        //Do stuff
    }
});

And now it works. I'm using firefox 4 and IE9 and believe the reason is connected to the way the browser is sending the info encoded... in the $.post() case it looks like it sends the data as application/x-www-form-urlencoded

I'll be glad to hear from you guys!

Regards, byte_slave

Answer 1

I'm not sure why it was working before; perhaps a jQuery update changed behaviour?

As to your question on the content-type, $.post is a shorthand wrapper around $.ajax, and from the $.ajax api page, the default value for the contentType is 'application/x-www-form-urlencoded'.

AFAIK, you can't specify the contentType using $.post(). I could be wrong though.

Answer 2

The equivalent with $.ajax should be

$.ajax({
    url: "/Route/Save",
    data: { myObj: JSON.stringify(myObj), accessToken: getAccessToken()},
    type: 'POST',       
    success: function (data)
    {
        //Do stuff
    }
});