Making a call to the openweather API. When I input the URL into a browser, I can see the JSON object. However my ajax below is not allowing anything to appear in my HTML. Even if I want to document.write the entire json object, I cannot. I can output the lat and long just find so the geolocation is working. Not sure what's wrong with this code.
Here's the HTML:
<body>
<div class="container">
<div class="col-lg-12 header">
<h1>My Location</h1>
</div>
<div class="row text-center box">
<div class="col-lg-12" id="data">Lat Long</div>
</div>
</div>
</body>
Here's the JS:
$(document).ready(function() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(main);
}
});
function main(position){
var lat = position.coords.latitude;
var long = position.coords.longitude;
var api = "http://api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + long + "&appid=[redacted key]";
$.ajax({
dataType: 'json',
url: api,
success: function(data) {
city = data.name;
$("#data").html(city);
}
});
}
