1

So I am learning how to use API's and ajax and wrote the following code based on a tutorial I was taking on the Instagram API. On the first go around I was able to get it to work (able to pull photos from Instagram), however I must have changed something by accident afterwards (no idea) because now things aren't working and I keep getting the error message "Uncaught TypeError: Cannot read property '0' of undefined" and I have no clue as to why. My code is as follows:

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>IG3</title>
    <script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script src="./js/app.js"></script>
</head>
<body>
    <h1>Popular Pictures</h1>
    <ul class="popular"></ul>
</body>
</html>

jQuery

$(document).ready(function() {
    $.ajax({
        type: "GET",
        dataType: "jsonp",
        cache: false,
        url: "https://api.instagram.com/v1/media/popular?access_token=806401368.f59def8.e8efe19844fd46238d592f9f20216f88",
        success: function(data) {
            for (var i = 0; i < 6; i++) {
                $(".popular").append("<li><a target='_blank' href='" + data.data[i].link + "'><img src='" + data.data[i].images.low_resolution.url + "'></img></a></li>");
            }
        }
    });
});

This is the line where I receive the error:

$(".popular").append("<li><a target='_blank' href='" + data.data[i].link + "'><img src='" + data.data[i].images.low_resolution.url + "'></img></a></li>");

Any ideas??

2
  • Did you visit the url separately?
    – hjpotter92
    Aug 27, 2014 at 3:05
  • Are you correctly performing the rest of the OAuth authentication process? As this code stands from what you've shared, you aren't handling the error that Instagram is generating when the API connection fails (visit URL directly and you'll see).
    – scrowler
    Aug 27, 2014 at 4:23

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.