CODEWITHSUNDEEP
javascriptjqueryajaxjsondjango
thomas
thomas

Reputation: 1174

Viewing the JSON from an AJAX call

I have this AJAX call -

$('#search').keyup(function() {
    $.ajax({
        type: "GET",
        url: "/main/search/",
        data: {
            'search_text': $('#search').val()
        },
        success: function(data) {
            alert(data);
        },

        dataType: 'html'
    });
});

The url redirects to a Django view with a template doing something like this -

{% if item_list.count > 0 %}
{% for obj in item_list %}
<p>{{obj.name}}</p>
{% endfor %}

{% else %}
No items!
{% endif %}

This gives the following alert - 

<p> Item1 </p>
<p> Item2 </p>

and so on, according to the search matches.

Now for learning purposes I want to see how the JSON response would look like, and what I could do with it. However, this-

$('#search').keyup(function() {
        $.ajax({
            type: "GET",
            url: "/main/search/",
            data: {
                'search_text': $('#search').val()
            },
            success: function(data) {
                alert(data);
            },

            dataType: 'json'
        });
    });

doesn't even open an alert box.

And, if I look at the "Network" tab in the Chrome inspector, I see that the response is an HTML response just like the previous one.

Why is this happening? How could I see the JSON response?

Upvotes: 0

Views: 52

Answers (2)

daviesgeek
daviesgeek

Reputation: 831

You could also open up your console and look in the network tab. From there, you should be able to see all the XHR requests, view the responses, headers, etc

Upvotes: 0

jcvegan
jcvegan

Reputation: 3170

you can use the console.log(data);

like this:

$('#search').keyup(function() {
        $.ajax({
            type: "GET",
            url: "/main/search/",
            data: {
                'search_text': $('#search').val()
            },
            success: function(data) {
                console.log(data);
            },

            dataType: 'json'
        });
    });

Upvotes: 1

Related Questions