CODEWITHSUNDEEP
javascriptjqueryhtmljson
user609306
user609306

Reputation: 1371

Javascript Json Jquery Basics

today, i learned the basics of Json and its parsing through Jquery. I know my question is futile but i am stuck and unable to get a way out.

the following code doesn't work....but i guess i did everything ok

<html>
<head>
<div id="placeholder"></div>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>

<script>
$(document).ready(function(){

$.getJSON("http://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=2d34860785184c2e3458de2bc437ecfc&tags=rose&format=json&nojsoncallback=1&api_sig=b7303e1d0d8a9fbb1159404ca7927e98",function(data){
var output="<ul>";
for (var i in data.photos) {
    output+="<li>" + data.photos.photo[i].id+"</li>";


    if (i === 3){
    return false;
}
}
output+="</ul>";

document.getElementById("placeholder").innerHTML=output;
})
})
</script>
</head>

<body>


</body>

</html>

Upvotes: -1

Views: 125

Answers (1)

iConnor
iConnor

Reputation: 20189

You have your indexes wrong in the JSON you need to make the following changes.

Demo: http://jsfiddle.net/ALJkV/

$(document).ready(function () {

    $.getJSON("http://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=2d34860785184c2e3458de2bc437ecfc&tags=rose&format=json&nojsoncallback=1&api_sig=b7303e1d0d8a9fbb1159404ca7927e98", function (data) {
        var output = "<ul>";
        for (var i in data.photos.photo) { // The photo index is what you need;

            // If you want to skip 3
            if (i == 3) continue;
            // Or if you want to stop at 3 
            if(i == 3) break;

            output += "<li>" + data.photos.photo[i].id + "</li>";
        }
        output += "</ul>";

        document.getElementById("placeholder").innerHTML = output;
    });
});

Continue: https://developer.mozilla.org/en...

Upvotes: 2

Related Questions