2007 2009 Marco Papa Ellis Horowitz 37 Imported JavaScript script01js

2007 2009 marco papa ellis horowitz 37 imported

This preview shows page 37 - 41 out of 84 pages.

© 2007-2009 Marco Papa & Ellis Horowitz 37 Imported JavaScript-script01.js window.onload = initAll; var xhr = false; function initAll() { document.getElementById("makeTextRequest").onclick = getNewFile; document.getElementById("makeXMLRequest").onclick = getNewFile;} function getNewFile() { makeRequest(this.href); return false;} function makeRequest(url) { if (window.XMLHttpRequest) { xhr = new XMLHttpRequest();} else { if (window.ActiveXObject) { try { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { } } } if (xhr) { xhr.onreadystatechange = showContents; xhr.open("GET", url, true); xhr.send(null); } else { document.getElementById("updateArea").innerHTML = "Sorry, but I couldn't create an XMLHttpRequest"; } } function showContents() { if (xhr.readyState == 4) { if (xhr.status == 200) { var outMsg = (xhr.responseXML && xhr.responseXML.contentType=="text/xml") ? xhr.responseXML.getElementsByTagName("choices")[0].textContent : xhr.responseText; } else { var outMsg = "There was a problem with the request " + xhr.status; } document.getElementById("updateArea").innerHTML = outMsg; } } On page load the onclick event is set to call the function When the click is made, getNewFile and makerequest are executed . showContents waits for a successful return of an file; it then prints the result in the browser
Image of page 37
© 2007-2009 Marco Papa & Ellis Horowitz 38 Browser Output Result of clicking on the first link Result of clicking on the second link
Image of page 38
© 2007-2009 Marco Papa & Ellis Horowitz 39 Second Ajax Example – Using Ajax to Download Files from Flickr Here is the html file, which basically loads script02.js <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"> <html><head><title>Second Ajax Script</title> <script src="script02.js" type="text/javascript" language="Javascript"></script> </head><body><div id="pictureBar"> </div></body></html> Here is script02.js window.onload = initAll; var xhr = false; function initAll() { if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); } else { if (window.ActiveXObject) { try { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { } } } if (xhr) { xhr.onreadystatechange = showPictures; xhr.open("GET", "flickrfeed.xml", true); xhr.send(null); } else { alert("Sorry, but I couldn't create an XMLHttpRequest"); } } function showPictures() { var tempDiv = document.createElement("div"); var pageDiv = document.getElementById("pictureBar"); if (xhr.readyState == 4) { if (xhr.status == 200) { tempDiv.innerHTML = xhr.responseText; var allLinks = tempDiv.getElementsByTagName("a"); for (var i=1; i<allLinks.length; i+=2) { pageDiv.appendChild(allLinks[i].cloneNode(true)); } } else { alert("There was a problem with the request " + xhr.status); } } } ShowPictures retrieves an file from flickr; The result is extracted from responseText and assigned to innerHTML property
Image of page 39
© 2007-2009 Marco Papa & Ellis Horowitz 40 Portion of Flickr XML file <?xml version=“1.0” encoding=“utf-8” standalone=“yes”?> <feed xmlns= Xmlns=; <title>Dori Simth’s Photos</title> <link rel=“self” href=/> <link rel=“alternate” type=“text/html” href=/> <id>tag:flickr.com,2005:/photos/public/116078</id> <icon>;
Image of page 40
Image of page 41

You've reached the end of your free preview.

Want to read all 84 pages?

  • Fall '07
  • Papa
  • Ajax, Ellis Horowitz, Marco Papa

  • Left Quote Icon

    Student Picture

  • Left Quote Icon

    Student Picture

  • Left Quote Icon

    Student Picture