nabs82
nabs82

Reputation: 101

API call not working in jquery

I am working to create a web app to Show the Local Weather. I am first calling navigator.geolocation to get the longitude and latitude, then using below link to give the API call and get the respond.

http://openweathermap.org/current#geo

Trying to get the respond only now, will convert to html later. But not getting anything. Please help.

My codepen- http://codepen.io/nabendu82/pen/ONPvrN

$(document).ready(function () {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function (position) {
            var latitude = position.coords.latitude;
            var longitude = position.coords.longitude;
        });
    }

    $("#getTemp").on("click", function () {
        $.getJSON("api.openweathermap.org/data/2.5/weather?lat=latitude&lon=longitude", function (json) {
            $(".message").html(JSON.stringify(json));
        });
    });
});

Upvotes: 0

Views: 85

Answers (5)

nabs82
nabs82

Reputation: 101

Got it correct by using the appid from the weather api.

$(document).ready(function () {
var latitude;
var longitude;
if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function (position) {
        latitude = position.coords.latitude;
        longitude = position.coords.longitude;
    });
}

$("#getTemp").on("click", function () {
var appid = 'xxxxxxxxxxxxxxxxxxxxxxx';
var url = "api.openweathermap.org/data/2.5/weather?lat=" + latitude + "&lon=" + longitude + "&appid" + appid;
    $.getJSON(url, function (json) {
    $(".message").html(JSON.stringify(json));
});
});

Upvotes: 0

Shahrukh Ahmad
Shahrukh Ahmad

Reputation: 153

2 things :

  • get variables longitude and latitude fit in API
  • your api call is using relative path , try calling it with absolute link

try this code

$(document).ready(function () {
var latitude = 0;
var longitude = 0;
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(function (position) {
                    latitude = position.coords.latitude;
                    longitude = position.coords.longitude;
                });
            }

            $("#getTemp").on("click", function () {
        var url = "http://api.openweathermap.org/data/2.5/weather?lat="+latitude +"&lon="+longitude ;
                $.getJSON(url , function (json) {
                    $(".message").html(JSON.stringify(json));
                });
            });
});

Upvotes: 0

Raja Sekar
Raja Sekar

Reputation: 2130

var baseUrl = "//api.openweathermap.org/data/2.5/weather?";
var lat = "lat="+ latitude;
var lan = "&lon="+ longitude;

$.getJSON(baseUrl+lat+lan, function(json){
 $(".message").html(JSON.stringify(json));
})

Upvotes: 0

Daniel
Daniel

Reputation: 88

Declare variables earlier. This API requires key - http://openweathermap.org/faq#error401

$(document).ready(function () {
    var latitude;
    var longitude;
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function (position) {
            latitude = position.coords.latitude;
            longitude = position.coords.longitude;
        });
    }

    $("#getTemp").on("click", function () {
        $.getJSON("api.openweathermap.org/data/2.5/weather?lat=" + latitude + "&lon=" + longitude, function (json) {
        $(".message").html(JSON.stringify(json));
    });
});

});

Upvotes: 0

Lelio Faieta
Lelio Faieta

Reputation: 6663

You should use something like:

$.getJSON('api.openweathermap.org/data/2.5/weather?lat='+latitude+'&lon='+longitude, function (json) {

Otherwise you are passing latitude and longitude as strings and not their values

Upvotes: 2

Related Questions