Stuck in weather app challenge - script tag bug in Codepen?

Stuck in weather app challenge - script tag bug in Codepen?
0

#1

Hello everyone. I’m currently developing the weather app challenge and I’m facing a problem. I have this code to make a callback to a function and get the json file I need, and it works perfect when in local, but codepen just won’t make it work. I’ve tried a few options and nothing seems to be working.

I have this in the html section:

script src=“http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139&appid=mykeyapp&callback=climacallback”></script

And this in the javascript section, with an alert to know when it’s being executed:

function climacallback(json) {
alert(“HELLO!”);
datosclima =json;
}

I tried chaging the script tag for this in the javascript section and it doesn’t work, just like before:

var script = document.createElement(‘script’);
script.src = ‘http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139&appid=mykeyapp&callback=climacallback’

As I said before, If I run this directly in my browser it works perfectly fine. But it crashes in codepen, it seems to have some problem with that script tag, as the function is never called. Could you give me some help, please?

Here you can see directly how it doesn’t work: http://codepen.io/ralgtrx/pen/mEagvJ

By the way, I did add the jquery and jqueryUI just to be sure that wasn’t the problem…


#2

HI ! :wave:

API calls like you made are not normally put between script tags, they are made in code. For this particular challenge, I recommend you read about XMLHttpRequest or if you feel like doing it using Jquery (I find it’s easier this way) learn about $.getJSON

Good luck !


#3

I’ll give both of them a good luck. I remember trying to use $.getJSON a while back and it didn’t work, but I’ll give it a second try. Thanks a lot for your advice. I still don’t understand why it doesn’t work tho, I really like how simple is to use it that way :frowning:


#4

script tag should point to your javascript code file … dont think you can point it to openweathermap

when making it in code pen you dont even need script tag … just type code in the js section and also click the gear icon and click quick insert and add jquery.

you need to create a function to send a request to openweathermap … what you have is the url that used in the request (take the … &callback=climacallback … off ) for the time being
watch the following video it shows how to make the function you should be using … it shows a json type and a ajax type

then you need to use the information that comes back

when you get that sorted youll need to go back to your url and decide how to add the longatitude and latitude as at the moment you are doing it manually.

if you need further help just post here


#5

I was finally able to do it, I used $.ajax and it finally works. Thanks a lot for your advices and taking the time to lend me some help :smiley:

$.ajax({
url: urljson,
dataType: “jsonp”,
jsonpCallback: “climacallback”
});