CODEWITHSUNDEEP
jqueryasp.netajaxjson
The Jonas Persson
The Jonas Persson

Reputation: 1746

Jquery getJSON not working, but ajax does

I have an issue that is bugging me, though it is not stopping me since I have a work-around. I'm trying to do an ajax call to a page method I have on an aspx page. I need to get json back, but the WebMethod GetGender is never called, unless I use an $.ajax call.

So, this WORKS:

    $.ajax({
        type: "POST",
        url: "StudentFunctions.aspx/GetGender",
        data: "{}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            var data = google.visualization.arrayToDataTable(msg.d);
            var options = {
              title: 'Gender',
              height: '5000px'
            };

            var chart = new google.visualization.PieChart(document.getElementById("chart_div"));
            chart.draw(data, options);
        }
    });

But, none of the below work:

$.get("StudentFunctions.aspx/GetGender", function(msg) { 
        alert(msg)
     }, "json");

$.post("StudentFunctions.aspx/GetGender", function(msg) { 
        alert(msg)
     }, "json");

$.getJSON("StudentFunctions.aspx/GetGender", function(msg) { 
        alert(msg)
     });

The three functions above doesn't even trigger the .Net function, but if I remove the "json" part from $.post and $.get, they at least calls the back-end function, but of course, doesn't return json.

Also, another question that I feel foolish for not understanding, but when I get the json response in the $.ajax function, what does that object (here called msg) look like? msg.d does the trick for me, but I don't know why. Is there a specification somewhere?

Upvotes: 2

Views: 1156

Answers (2)

Steven V
Steven V

Reputation: 16595

This is assuming the called function from jQuery is a WebMethod.

According to Scott Gu the WebMethod requires the AJAX request to be a HTTP POST (unless disable this protection), and contain the content type HTTP header application/json. If that HTTP Header is missing, ASP.NET will reject the request.

Because of that requirement, $.get(), and $.post() don't work because they are convenience methods which don't always contain the required content type. So you need to use the $.ajax(), so the content type HTTP header can always be sent.

Upvotes: 2

Steve Westbrook
Steve Westbrook

Reputation: 1708

Well, it "just won't work," but at least I can tell you why. If you download the dev (non-compressed) version of jquery and drill into the post function, you'll see that internally it's just a helper function to call the ajax function that works. However, it does not include the contentType, nor does it allow you to set it! This is the code:

    return jQuery.ajax({
        url: url,
        type: method,
        dataType: type,
        data: data,
        success: callback
    });

As you can see, there is no contentType. You can replicate the same failure by removing contentType from the ajax method. So there you have it - but at least you know you're not losing anything other than slightly prettier code.

Upvotes: 2

Related Questions