Tadjiev Codes8,508 Points
AJAX JSON FILE
Dear Folks and Mr.Steven, If you could pls take a look at my code for a moment to see what's wrong with it. I researched about JSON from the book of Jon Ducket and he says that
/*JSONP (sometimes written JSON-P) involves adding a <script> element into the page, which loads the JSON data from another server. This works because there are no rest rictions on the source of script in a <script> element. The script contains a call to a function, and the JSONformatted data is provided as an argument to that function. The function that is called is defined in the page that requests the data, and is used to process and display the data. See next page*/ 1. A function that will process the JSON data that the server sends. In the example on the next page, the function is ca lled showEvents () . 2. A <script> element whose src attribute will request the JSON data from the remote server. <script> function showEvents(data) // Code to process data and // display it in t he page here </ script> <script sr c="http: //example.or g/jsonp"> </ script>
I tried to do like he says, to add my JS code inside a script in HTML and script src for thee URL. But still it shows only the name and the productid and can't display the image. OR is that a CSS problem? I guess it might be sth connected with JS. And even when it was in external JS file. It was working the same way. So I"m a bit confused with what the book says and with the issue that I'm having.
The workspace: https://w.trhou.se/93y6mpn2xk
It would be great if you could review it whenever you have a little free time Mr.Steven
Zimri Leijen8,957 Points
I replied in the other thread. The issue in the snapshot you shared there was that you change the src of a div, it works fi you make the div an img instead.
Note that the API provides a lot of dead links, so not ALL images will work, but about 30% to 40% of them does.
Steven Parker194,962 Points
But the AJAX call works, and the problem with the image is that "src" attribute of the element with id "beerName" is being updated with the image URL, but that element is a div instead of an img.
Once that's fixed, it will display images for some items but not all. That's the API's fault, not every URL it provides leads to an image. You may want to notify the provider's customer service staff.
Tadjiev Codes8,508 Points
Thanks a lot. Just because of the div tag it was not working damn( Such a stupid mistake. I thought div can contain the image but yeah as per HTML it should be in an image tag