Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

melissa brown
melissa brown
4,670 Points

flickr api key/ ajax

Im trying to improve the ajax flickr application, by adding a api key instead of using the public feed url. Can anyone tell me why this is not working? the current application search brings up inaccurate image searches

$(document).ready(function() {


 var flickerAPI = "http://api.flickr.com/services/rest/?&method=flickr.people.getPublicPhotos&api_key=[replace withmyapikey]&user_id=[replacewithmyid]&per_page=250&page=2&format=json&jsoncallback=?";


  //var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";


 $('form').submit(function (evt) {
    var $submitButton = $('#submit');
    var $searchField = $('#search');
    evt.preventDefault();
    $searchField.prop("disabled",true);
    $submitButton.attr("disabled", true).val("searching....");
    var animal = $searchField.val();
    $('#photos').html('');
    $.getJSON(flickerAPI, {
        tags: animal,
        format: "json"
      },
    function(data){
      var photoHTML = '';
      if (data.items.length > 0) {
        $.each(data.items,function(i,photo) {
          photoHTML += '<li class="grid-25 tablet-grid-50">';
          photoHTML += '<a href="' + photo.link + '" class="image">';
          photoHTML += '<img src="' + photo.media.m + '"></a></li>';
        }); // end each
      } else {
        photoHTML = "<p>No photos found that match: " + animal + ".</p>"
      }
      $('#photos').html(photoHTML);
      $searchField.prop("disabled", false);
      $submitButton.attr("disabled", false).val("Search");
    }); // end getJSON

  }); // end click

}); // end ready

Can you please format your code, so we can view it properly.