CODEWITHSUNDEEP
javascriptjqueryhtmljson
GeorgeTaylor
GeorgeTaylor

Reputation: 63

JQuery $.getJSON confused me

I am completely confused by the $.getJSON function! 

$.getJSON('http://api.worldweatheronline.com/free/v1/weather.ashx?key=mykey&q=' + lat + ',' + longi + '&fx=no&format=json', function(data) {
    $('#weather').html('<p> Humidity: ' + data.current_condition.humidity       + '</p>');
    $('#weather').append('<p>Temp : '    + data.current_condition.temp_C         + '</p>');
    $('#weather').append('<p> Wind: '    + data.current_condition.windspeedMiles + '</p>');
});

This is the json that is at that url is:

{
   "data":{
      "current_condition":[
         {
            "cloudcover":"0",
            "humidity":"82",
            "observation_time":"04:07 PM",
            "precipMM":"0.2",
            "pressure":"997",
            "temp_C":"11",
            "temp_F":"52",
            "visibility":"10",
            "weatherCode":"356",
            "weatherDesc":[
               {
                  "value":"Moderate or heavy rain shower"
               }
            ],
            "weatherIconUrl":[
               {
                  "value":"http:\/\/cdn.worldweatheronline.net\/images\/wsymbols01_png_64\/wsymbol_0010_heavy_rain_showers.png"
               }
            ],
            "winddir16Point":"WSW",
            "winddirDegree":"240",
            "windspeedKmph":"26",
            "windspeedMiles":"16"
         }
      ],
      "request":[
         {
            "query":"Lat 51.24 and Lon -1.15",
            "type":"LatLon"
         }
      ]
   }
}

It must be something to do with my syntax!

Upvotes: 0

Views: 104

Answers (2)

super
super

Reputation: 2328

Try this :

$.getJSON('http://api.worldweatheronline.com/free/v1/weather.ashx?key=mykey&q=' + lat + ',' + longi + '&fx=no&format=json&callback=?', function (data) {
    $('#weather').html('<p> Humidity: ' + data.data.current_condition[0].humidity + '</p>');
    $('#weather').append('<p>Temp : ' + data.data.current_condition[0].temp_C + '</p>');
    $('#weather').append('<p> Wind: ' + data.data.current_condition[0].windspeedMiles + '</p>');
});

because current_condition is an object array you can access it by using its index. addition data property because your JSON itself wrapped with data object.

Upvotes: 0

Arun P Johny
Arun P Johny

Reputation: 388326

Try to pass callback=? as the callback function for using jsonp format

$.getJSON('http://api.worldweatheronline.com/free/v1/weather.ashx?key=mykey&q=' + lat + ',' + longi + '&fx=no&format=json&callback=?', function (data) {
    $('#weather').html('<p> Humidity: ' + data.current_condition.humidity + '</p>');
    $('#weather').append('<p>Temp : ' + data.current_condition.temp_C + '</p>');
    $('#weather').append('<p> Wind: ' + data.current_condition.windspeedMiles + '</p>');
});

Upvotes: 1

Related Questions