0

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);
  });
});
Community
  • 1
  • 1
Stomper
  • 11
  • 4

1 Answers1

1

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.

vinay hegde
  • 99
  • 10
  • Thanks A callback function is not needed for an asynchronous call, ie. .getJSON? What is the synchronous alternative? I have added your snippet with the .done callback function but it is still not returning a value. How long does it take for it return the data from the .done callback function? – Stomper Jun 05 '16 at 20:04
  • .done is your callback. Synchronous is not a good option to choose as the UI would be blocked/not-responsive. But, since you asked for a synchronous alternative, I'm providing it here $.ajax({ type: "GET", url: "some_url", async: false }); Setting "async" to false makes your AJAX call synchronous. Can you share your codepen link? I'm happy to help you debug – vinay hegde Jun 05 '16 at 23:30
  • Also, Why are you setting your lat and long variables outside the "if"? I suggest you to declare the variables before the "if" condition and set the variables inside the condition. Have an else case, to inform the user if the geolocation is not supported by the user. – vinay hegde Jun 05 '16 at 23:58
  • This is happening because getCurrentPosition() is deprecated for HTTP in google chrome. When you try it in firefox, it works. Refer this post: http://stackoverflow.com/questions/32106849/getcurrentposition-and-watchposition-are-deprecated-on-insecure-origins. The comment by "gogson" in that post should help you. This is the fiddle that he created: http://jsfiddle.net/gogs/jwt9f1o3/ – vinay hegde Jun 06 '16 at 00:27
  • You are correct, it also works in Opera, which I am currently working with. I've looked at the JSFiddle you provided Can I PM you my codepen? Another geolocation API I've found was geoip-db.com, which when tried also worked. I'm still currently working with the getCurrentPosition. After implementing your previous weather API call with callback/done, it is still not working. Does that mean the call is unsuccessful? I'm certain the URL with the LAT LONG values is correct, so I'm not sure as to why it still not working. Thanks again – Stomper Jun 12 '16 at 00:45
  • Sure, PM me your codepen. I will take a look at it. – vinay hegde Jun 13 '16 at 15:50
  • Thanks, will do, but apparently you can't PM here, do you have email visible on your profile page? – Stomper Jun 15 '16 at 01:17