Hey all,
I am going through the FCC intermediate front end projects and decided to take the Udacity “Intro to AJAX” course to build a better foundation.The course has me building a “Move Planner App”, which brings in information based on a street and city and displays it on the page.
I am using the New York Times API to bring in and display articles about the city. The request is successful and the information displays properly, I am just having trouble getting the .error() method to work. If I don’t have the .error() method chained to the $.getJSON request it works fine, but when as soon as I add .error(), the data fails to load at all. Here is my code.
Without .error(), works fine:
$.getJSON(nytUrl, function(data) {
$nytHeaderElem.text("New York Times Articles About " + city);
articles = data.response.docs;
for (i = 0; i < articles.length; i++) {
var article = articles[i];
$nytElem.append('<li class="article">' + '<a href="' + article.web_url + '">' + article.headline.main + '</a>' + '<p>' + article.snippet + '</p>' + '</li>');
};
});
With .error(), the page flashes and none of the requests work (even the img request fails to stay on the page):
$.getJSON(nytUrl, function(data) {
$nytHeaderElem.text("New York Times Articles About " + city);
articles = data.response.docs;
for (i = 0; i < articles.length; i++) {
var article = articles[i];
$nytElem.append('<li class="article">' + '<a href="' + article.web_url + '">' + article.headline.main + '</a>' + '<p>' + article.snippet + '</p>' + '</li>');
};
}).error(function(e){
$nytHeaderElem.text('Could Not Load New York Times Articles')
});
Any input on this would be helpful!
Thanks!