jQuery $.post(url, json, promise, "json") has bad request while $.ajax() doesn't. Don't know why?

Question

In jQuery, I am referencing https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js . But I think I have problems with jQuery's $.post() when I follow their template very closely, i.e.,

  $.post( "test.php", { func: "getNameAndTime" }, function( data ) {
     console.log( data.name ); // John
     console.log( data.time ); // 2pm
  }, "json");

Here's my code:

$( document ).ready(
function ()    {
    var javaObj = {
        _dataFreq: "0"
        , _period: $( "#interval" ).val()
        , _time: $( "#dayTo" ).val() + ".00"
        , _ptNames: $( "#ptNames" ).val().split( ',' ) //string[]
    }
    $.ajax( {
        type: 'POST'
        , url: mySrvEndPont
        , data: JSON.stringify(javaObj) 
        , success: function ( response ) {
            alert( "OK");
        }
        , error: function ( e ) {
            alert( e );
        }
        , contentType: "application/json"
        , dataType: "json"
    } );
    $.post( mySrvEndPont, JSON.stringify(javaObj), function ( response )
    {
            alert( "OK" );
    } , "json")
    ;
} );

I got "OK" and a valid response object from $.ajax(), but nothing except a 400 bad request from $.post() !!! Just want to know why.

A good way to trace the mistake is check and compare both requests (compare headers, parameters) sent to your server. Did you try it? — mfvjunior, Oct 24 '16 at 18:08
http://stackoverflow.com/questions/2845459/jquery-how-to-make-post-use-contenttype-application-json — BenG, Oct 24 '16 at 18:19
Try this link to find the answer: http://stackoverflow.com/questions/2845459/jquery-how-to-make-post-use-contenttype-application-json — Saxon, Oct 24 '16 at 18:36

Leonardo Paglialunga · Answer 1 · 2016-10-24T18:49:48.080

1

I think that $.post does not set the content type header as "application/json", and that could probably be the cause of the bad request status.

If i'm right, you should not use the $.post shorthand, go with $.ajax and set the content type manually.

This:

$.post(mySrvEndPont, JSON.stringify(javaObj), function(d){} , "json");

is a shorthand for this:

$.ajax({
    type: 'POST'
    url: mySrvEndPont,
    data: JSON.stringify(javaObj),
    success: function (d) {},
    dataType: "json"
});

And if i'm supposing right, what you actually need is this:

$.ajax({
    type: 'POST'
    url: mySrvEndPont,
    data: JSON.stringify(javaObj),
    success: function (d) {},
    contentType: "application/json",
    dataType: "json"
});

edited Oct 24 '16 at 18:49

answered Oct 24 '16 at 18:11

Leonardo Paglialunga

328
4
9

That still doesn't set the content type. The last argument specifies the type of the response, not the type of the content. – Barmar Oct 24 '16 at 18:28
@Barmar Yes, that is exactly what i've tried to say. Maybe i didn't phrase it correctly (not a native english speaker). Sorry for that. – Leonardo Paglialunga Oct 24 '16 at 18:46
I thought you were showing the correct way to write it to set the content type. If not, how does this solve the problem? – Barmar Oct 24 '16 at 18:49
1

Just edited, hope it's more clear now. If the content type is the actual problem, the solution would be not using the $.post function. – Leonardo Paglialunga Oct 24 '16 at 18:52
1

Nice! That 'json' is setting the type/format of the response that you got from the server, the contentType sets the http header **content type** instead, which indicates the format of the data you're sending to the server. It seems that google validates that before parsing your request. – Leonardo Paglialunga Oct 24 '16 at 20:21
Leonardo is perfectly correct! That little param "json" at the end of the $.post () did not set the posted data to content-type json! Who knows what that little "json" is doing? But it is answered by Leonardo :) ! – Jenna Leaf Oct 24 '16 at 20:54

Jenna Leaf · Accepted Answer · 2016-10-24T20:28:06.167

0

The difference is one header ($.ajax's) having Content-Type = application/json set correct while the other has application/x-www-form-urlencoded; charset=UTF-8 (wrong!). I guess that kills it. Unless jQuery has a 'complete' documentation on how to set the content-type to application/json in their shorthand $.post(), I will resort to using $.ajax() !!!

edited Oct 24 '16 at 20:28

answered Oct 24 '16 at 20:04

Jenna Leaf

2,255
21
29

If this answer (or another) provided you with a resolution you should accept that by clicking the check to the left. If not, please update your question as to why not OR add a new answer that did. – Mark Schultheiss Apr 16 '19 at 14:13

jQuery $.post(url, json, promise, "json") has bad request while $.ajax() doesn't. Don't know why?

2 Answers2