JQuery / $.get is not displaying my data

Question

Hi there.

In the example below, the alert dialog box is not displaying at all. Any ideas why?

$.get('http://ajax.googleapis.com/ajax/services/search/web?v=1.0&q=Earth%20Day',function(data) { alert("DATA LOADED: " + data); });   

Answer 1

The reason your call is not working, is you are trying to make a cross-domain request with the normal $.get function of jQuery. You need to use $.getJSON and add &callback=? to the url so jQuery will treat it as a JSONP request:

$.getJSON(
    'http://ajax.googleapis.com/ajax/services/search/web?v=1.0&q=Earth%20Day&callback=?',
    function(data) { alert("DATA LOADED: " + data); }
);   

You can also write your request this way to be a little more readable. Just remember the callback=? has to be in the URL and cannot be included in the object literal with the other key/value pairs:

$.getJSON(
    'http://ajax.googleapis.com/ajax/services/search/web?callback=?',
    { v:'1.0', q:'Earth Day' },
    function(data) { alert("DATA LOADED: " + data); }
);