info343/labs/6/solution/pet-it-ex3.js

// pet-it-ex3.js
// Sample JavaScript solution for Lab 6: Pet-It
// (Partial solution through Exercise 3.)
// INFO 343, Autumn 2012

// Make ajaxError handle all Ajax errors.
$.ajaxSetup({ error: ajaxError });

// When the page is ready, attach event handlers.
$(document).ready(function() {
   $("#dogs, #cats").change(getBreeds);
   $("#next").click(nextClick);
});

// Get the list of breeds indicated by the currently-selected radio button.
function getBreeds() {
   $.get(this.id + ".txt", injectBreeds);
}

// Populate the Breeds list with the given list of breeds.
function injectBreeds(data) {
   // Clear previous list.
   $('#breeds ul').html('');
   
   // Create a new <li> for each breed in the list, and inject it into the ul in
   // the #breeds sidebar.
   var breeds = data.split("\n");
   for (var i = 0; i < breeds.length; i++) {
      $("<li>").text(breeds[i]).appendTo("#breeds ul");
   }
   
/*[<ins>]*/   // Determine the name of this breed's image/html file.
   var currentfilename = breeds[index].toLowerCase().replace(" ", "_");
   
   // Fetch & inject description of this breed.
   $('#description').load("breeds/" + currentfilename + ".html");
   
   // Display this breed's image.
   $("#pet").attr('src', "breeds/" + currentfilename + ".jpg");/*[</ins>]*/
}

// Provided Ajax failure code.
function ajaxError(xhr, type, error) {
   alert("Error making Ajax request!\n\n" + 
      "Status code: " + xhr.status + "\n" +
      "Status text: " + error + "\n\n" + 
      "Full text of response:\n" + xhr.responseText);
}