SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    Former Staff Member silver trophy Adam P.'s Avatar
    Join Date
    Apr 2001
    Location
    San Francisco
    Posts
    3,288
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Arrow Simple JSON Callback Error

    I'm trying to create a "Books I'm Reading" widget using the Readernaut API. I'm using JSON with a callback. This is a portion of what the JSON URL returns:

    Code JavaScript:
    parseResponse(
    {
          "version": "1.0", 
          "page": 1,
          "total_pages": 3,
          "reader_books": [
                {
                "reader_book_id": 72494,
                "user": {
                      "user_id": 658,
                      "username": "adampolselli"
                },
                "book_edition": {
                      "title": "Art \x26 Fear",
                      "subtitle": "Observations On the Perils",
                      "authors": {
                            "author": "David Bayles", 
                            "author": "Ted Orland"
                      },
                      "isbn": "0961454733",
                      "covers": {
                            "cover_small": "http://media.readernaut.com/book_covers/0961454733_t50.jpg",
                            "cover_medium": "http://media.readernaut.com/book_covers/0961454733_t100.jpg",
                            "cover_large": "http://media.readernaut.com/book_covers/0961454733_t150.jpg"
                      },
                      "permalink": "http://readernaut.com/adampolselli/books/0961454733/art-fear/"
              },
              "created": "2009-02-17 11:14 CST", 
              "modified": "2009-02-17 11:14 CST",
              "permalink": "http://readernaut.com/adampolselli/books/0961454733/art-fear/"
               },
     
                {
                "reader_book_id": 55374,
                "user": {
                      "user_id": 658,
                      "username": "adampolselli"
                },
     
                ...

    I simply want to use JavaScript to convert some of this info into HTML and output it as a small widget in the sidebar of my website. Here's what I have so far. It's all very basic.

    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    	<head>
    	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
    	<title>Readernaut Widget</title>
    	<link rel="stylesheet" type="text/css" href="css/master.css" />
    	
    	<script type="text/javascript">
    	function parseResponse(data) {
    		var books = document.getElementById("books");
    		
    		for (var i=0; i<data.reader_books.length; i++) {
    			var title = data.reader_books[i].book_edition.title;
    			var cover = data.reader_books[i].book_edition.covers.cover_medium;
    			
    			var header = document.createElement("h2");
    			var tit = document.createTextNode(title);
    			header.appendChild(tit);
    			
    			var img = document.createElement("img");
    			img.setAttribute("src",cover);
    			
    			books.appendChild(header);
    			books.appendChild(img);
    		}
    	}
    	</script>
    	<script type="text/javascript" src="http://readernaut.com/api/v1/json/adampolselli/books/?callback=parseResponse"></script>
    </head>
    <body>
    	<h1>Books I Am Reading</h1>
    	<div id="books"></div>
    </body>
    </html>
    Safari's Web Inspector throws this error: "TypeError: Result of expression 'books' [null] is not an object" in reference to the line "books.appendChild(header);"

    I am relatively new to JavaScript and this error is quite puzzling to me. What I thought would be a quick, fun project is turning out to be anything but! Any solutions, tips, guidance, etc. is very much appreciated. Thanks in advance!
    Last edited by Adam P.; Mar 18, 2009 at 14:12.
    SPF Mentor/Advisor 2001-2003
    SPF Designer of the Year 2002
    SPF Graphic Designer of the Year 2003
    AdamPolselli.com

  2. #2
    Former Staff Member silver trophy Adam P.'s Avatar
    Join Date
    Apr 2001
    Location
    San Francisco
    Posts
    3,288
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Figured it out. Had to put the scripts after the div I was attempting to modify.
    SPF Mentor/Advisor 2001-2003
    SPF Designer of the Year 2002
    SPF Graphic Designer of the Year 2003
    AdamPolselli.com


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •