Stomper
Stomper

Reputation: 11

OpenWeatherMapAPI Geolocation via LAT LONG is not working or printing

I've take the API URL and removed the variables and inserted actually LAT and LONG values in the browser, and it works. But when it is used in code with the LAT and LONG variables it does not work.

I've referred to existing questions here and here

I'm using similar if not identical syntax to successfully pull and print the LAT and LONG values, and then storing the variables. I am inserting the variables into the API URL but it is not printing. I don't know why.

Thanks!

This is my HTML

<html>
  <head>
      <meta charset="UTF-8">
      <title>Today's Weather | Malvin</title>
  </head>

  <body>

   <p id="geoLoc"></p>    

    <p id="currTemp"></p>

  </body>
</html>

And this is my JS/JQuery

//geolocation via freecodecamp exercise
$(document).ready(function(){
if (navigator.geolocation){
    navigator.geolocation.getCurrentPosition(function(position){
      $("#geoLoc").html("latitude: " + position.coords.latitude + "<br>longitude: " + position.coords.longitude);
    });
}

//jquery current weather via openweathermapp
var lat = position.coords.latitude;
var long = position.coords.longitude;
var weatherURL = "http://api.openweathermap.org/data/2.5/weather?lat="+lat+"&lon="+long+"&APPID=********f4144190680fc96bd357451d";
$.getJSON(weatherURL, function(data)
  {
  $('#currTemp').html("current temp: " + data.main.temp);
  });
});

Upvotes: 0

Views: 372

Answers (1)

vinay hegde
vinay hegde

Reputation: 109

Since you are making an asynchronous call through .getJSON, you need to use a callback function in the form of "done" or you can define your own custom callback function. For example: You can use "done" as a callback to your async call as shown below.

$.getJSON(weatherURL).done(function(data){
     $('#currTemp').html("current temp: " + data.main.temp);
});

The function defined by done would be executed when your AJAX call is successful.

Upvotes: 1

Related Questions