SitePoint Sponsor

User Tag List

Results 1 to 6 of 6

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    May 2011
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Please help - Dom Parsing XML file to HTML?

    DOM Parsing XML file (am new to using DOM and parsing files)

    Hi I am practicing with example files I found online (W3C) and would really appreciate some help with this.

    I am trying to use DOM to parse and XML file and then display the info retrieved from the XML file in HTML using Javascript

    The files are working well and validate, but nothing is displayed when I open the file up in a browser only the style sheet background color I am using

    There are 3 JS functions, one loads the XML, the second gets the info and the third displays it

    Here is the code, minus the Style sheet I have been trying to figure this out for days now, is it something little that I have missed? please help thanks

    HTML Code

    Code:
    <?xml version = "1.0" encoding = "utf-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <head>
    <title>Bookstore</title>
    
    <script type = "text/javascript">
    function loadXMLDoc(books.xml)
    {
    var xmlhttp;
    if (window.XMLHttpRequest)
      { // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
    xmlhttp.open("GET",books.xml,false);
    xmlhttp.send();
    return xmlhttp.responseXML;
      }
     else if (ActiveXObject("Microsoft.XMLDOM")) 
       { 
           xmlhttp = CreateObject( "Microsoft.XMLDOM" )
           xmlhttp.async="false" 
           xmlhttp.load(books.xml) 
           return xmlhttp.responseXML
       } 
    alert("Error loading document"); 
       return null; 
    }
    
    xmlDoc = loadXMLDoc("books.xml");
    var x=xmlDoc.getElementsByTagName("bookstore");
    var i=0;
    
    function info(i)
    {
    title=(x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue);
    author=(x[i].getElementsByTagName("author")[0].childNodes[0].nodeValue);
    year=(x[i].getElementsByTagName("year")[0].childNodes[0].nodeValue);
    
    txt="title"<br />"author"<br />"year"<br />";
    document.getElementById("showBooks").innerHTML=txt;
    }
    
    function display()
    {
    document.write("<table border='1'; >");
    for (var i=0;i<x.length;i++)
      { 
    document.write(x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue);
    document.write("</td><td>");
    document.write(x[i].getElementsByTagName("author")[0].childNodes[0].nodeValue);
    document.write("</td><td>");
    document.write(x[i].getElementsByTagName("year")[0].childNodes[0].nodeValue );
    document.write("</td><td>");
    	}
    }
     </script>
     </head>
    <body onload ="display()">
    <div id='showRecipe'></div>
    </body>
    </html>
    Here is the XML file

    Code:
    <?xml version="1.0" encoding="ISO-8859-1"?>
    <bookstore>
    <book category="cooking">
    <title lang="en">Everyday Italian</title>
    <author>Giada De Laurentiis</author>
    <year>2005</year>
    <price>30.00</price>
    </book>
    
    <book category="children">
    <title lang="en">Harry Potter</title>
    <author>J K. Rowling</author>
    <year>2005</year>
    <price>29.99</price>
    </book>
    </bookstore>
    Please help thanks really want to see why it won't display

  2. #2
    SitePoint Member
    Join Date
    Apr 2012
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    how did you go with this query? I have the exact same problem.

    Quote Originally Posted by dlace View Post
    DOM Parsing XML file (am new to using DOM and parsing files)

    Hi I am practicing with example files I found online (W3C) and would really appreciate some help with this.

    I am trying to use DOM to parse and XML file and then display the info retrieved from the XML file in HTML using Javascript

    The files are working well and validate, but nothing is displayed when I open the file up in a browser only the style sheet background color I am using

    There are 3 JS functions, one loads the XML, the second gets the info and the third displays it

    Here is the code, minus the Style sheet I have been trying to figure this out for days now, is it something little that I have missed? please help thanks

    HTML Code

    Code:
    <?xml version = "1.0" encoding = "utf-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <head>
    <title>Bookstore</title>
    
    <script type = "text/javascript">
    function loadXMLDoc(books.xml)
    {
    var xmlhttp;
    if (window.XMLHttpRequest)
      { // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
    xmlhttp.open("GET",books.xml,false);
    xmlhttp.send();
    return xmlhttp.responseXML;
      }
     else if (ActiveXObject("Microsoft.XMLDOM")) 
       { 
           xmlhttp = CreateObject( "Microsoft.XMLDOM" )
           xmlhttp.async="false" 
           xmlhttp.load(books.xml) 
           return xmlhttp.responseXML
       } 
    alert("Error loading document"); 
       return null; 
    }
    
    xmlDoc = loadXMLDoc("books.xml");
    var x=xmlDoc.getElementsByTagName("bookstore");
    var i=0;
    
    function info(i)
    {
    title=(x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue);
    author=(x[i].getElementsByTagName("author")[0].childNodes[0].nodeValue);
    year=(x[i].getElementsByTagName("year")[0].childNodes[0].nodeValue);
    
    txt="title"<br />"author"<br />"year"<br />";
    document.getElementById("showBooks").innerHTML=txt;
    }
    
    function display()
    {
    document.write("<table border='1'; >");
    for (var i=0;i<x.length;i++)
      { 
    document.write(x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue);
    document.write("</td><td>");
    document.write(x[i].getElementsByTagName("author")[0].childNodes[0].nodeValue);
    document.write("</td><td>");
    document.write(x[i].getElementsByTagName("year")[0].childNodes[0].nodeValue );
    document.write("</td><td>");
    	}
    }
     </script>
     </head>
    <body onload ="display()">
    <div id='showRecipe'></div>
    </body>
    </html>
    Here is the XML file

    Code:
    <?xml version="1.0" encoding="ISO-8859-1"?>
    <bookstore>
    <book category="cooking">
    <title lang="en">Everyday Italian</title>
    <author>Giada De Laurentiis</author>
    <year>2005</year>
    <price>30.00</price>
    </book>
    
    <book category="children">
    <title lang="en">Harry Potter</title>
    <author>J K. Rowling</author>
    <year>2005</year>
    <price>29.99</price>
    </book>
    </bookstore>
    Please help thanks really want to see why it won't display

  3. #3
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,240
    Mentioned
    194 Post(s)
    Tagged
    2 Thread(s)
    @Corlene, what have you tried so far that hasn't worked?

    @dlace, is info() doing anything?

  4. #4
    SitePoint Member
    Join Date
    Apr 2012
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    just one point, I see you have set my div to <div id='showRecipe'></div>
    Yet, you haven't made reference to my div in the head or above??? Could this be the problem??

  5. #5
    SitePoint Member
    Join Date
    Apr 2012
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    @dlace where exactly would you put info( )

  6. #6
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,240
    Mentioned
    194 Post(s)
    Tagged
    2 Thread(s)
    Quote Originally Posted by Corlene View Post
    @dlace where exactly would you put info( )
    Your HTML code has
    Code javascript:
    function info(i)
    {
    title=(x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue);
    author=(x[i].getElementsByTagName("author")[0].childNodes[0].nodeValue);
    year=(x[i].getElementsByTagName("year")[0].childNodes[0].nodeValue);
     
    txt="title"<br />"author"<br />"year"<br />";
    document.getElementById("showBooks").innerHTML=txt;
    }
    but I don't see it being called anywhere.


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
  •