i have been working on simple weather app project. user enters zip code input element (upon clicking button element) makes api call wunderground.com. few pieces of data grabbed json object, stringified , inserted dom.
(function() { var wundergroundapi = "https://api.wunderground.com/api/3b411ca908826af8/conditions/q/"; var input = $('input'); $('#submit').on('click', function() { var inputvalue = input.val(); var weatherbyzip = wundergroundapi += inputvalue += '.json'; $.getjson(weatherbyzip, function(json) { $('#temp-f') .text('temperature: ' + json.stringify(json['current_observation']['temp_f']) + ' f'); $('#location') .text('location: '+ json.stringify(json['current_observation']['display_location']['full'])); $('#weather') .text('weather: ' + json.stringify(json['current_observation']['weather'])); input.val(""); }) }); })(); the jquery works fine on first api call.
get https://api.wunderground.com/api/3b411ca908826af8/conditions/q/70118.json however, second api call not.
get https://api.wunderground.com/api/3b411ca908826af8/conditions/q/70118.json06840.json the issue seems in way declare weatherbyzip variable:
var weatherbyzip = wundergroundapi += inputvalue += '.json'; what intended weatherbyzip variable updated (with new inputvalue plus .json extension) each time function called. happens instead inputvalue , .json appended end of created variable.
70118.json06840.json 70118.json06840.json90210.json how fix jquery function rectify problem. is, each time function called (a button element clicked) new/updated api call occurs?
change += +
var weatherbyzip = wundergroundapi + inputvalue + '.json'; wundergroundapi += inputvalue means: take existing value of wundergroundapi , concatenate value of inputvalue behind that. that's reason wundergroundapi keeps getting longer.
Comments
Post a Comment