SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Nov 2011
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Javascript gets xml but when it loops it emptys the page

    Hi,

    I'm making a page which gets the contents of an xml file and creates a table and populates it. The problem is when it loops around it seems to strip everything from the page HTML, HEAD, BODY tags and everything inside of those and just puts the value of the elements from the xml file onto the page.

    My question is, am I able to perform this loop and keep the rest of the contents of the page intact?

    I've been trying for most of the day and I can't get this working. Any help would be appreciated.

    Code:
    <script type="text/javascript">
    
    setInterval ( "refresh()", 5000 );
    
    function refresh()
    {
    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
      }
    else
      {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.open("GET","status.xml",false);
    xmlhttp.send();
    xmlDoc=xmlhttp.responseXML; 
    var x=xmlDoc.getElementsByTagName("DEVICE");
    for (i=0;i<x.length;i++)
      { 
       document.write("<tr><td>");
      document.write(x[i].getAttribute("ID"));  
      document.write("</td>");
       document.write("<td>");
      document.write(x[i].getElementsByTagName("NAME")[0].childNodes[0].nodeValue);
      document.write("</td>");
       document.write("<td>");
      document.write(x[i].getElementsByTagName("ID")[0].childNodes[0].nodeValue);
        document.write("</td>");
       document.write("<td>");
      document.write(x[i].getElementsByTagName("DESIGNATION")[0].childNodes[0].nodeValue);
        document.write("</td>");
       document.write("<td>");
      document.write(x[i].getElementsByTagName("LOCATION")[0].childNodes[0].nodeValue);
        document.write("</td>");   
    	document.write("<td>");
      document.write(x[i].getElementsByTagName("SUBJECT")[0].childNodes[0].nodeValue);
      document.write("</td>");
      	document.write("<td>");
      document.write(x[i].getElementsByTagName("SUBJECT_ID")[0].childNodes[0].nodeValue);
      document.write("</td>");
      	document.write("<td>");
      document.write(x[i].getElementsByTagName("OTHER")[0].childNodes[0].nodeValue);
      document.write("</td>");
      	document.write("<td>");
      document.write(x[i].getElementsByTagName("RATING")[0].childNodes[0].nodeValue);
      document.write("</td>");
      	document.write("<td>");
      document.write(x[i].getElementsByTagName("NOTES")[0].childNodes[0].nodeValue);
      document.write("</td>");
        document.write("</tr>"); 
      }
    
    }
    </script>

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,527
    Mentioned
    84 Post(s)
    Tagged
    4 Thread(s)
    When you use document.write, if the page has finished loading the document.write will write the content to a new page and not to the current one.

    So, instead of writing out the raw HTML code, you should create elements and add those instead to the page.
    For example:

    Code javascript:
    function newTD(value) {
        var td = document.createElement('td');
        td.appendChild(document.createTextNode(value));
    }
    var table = document.getElementById('status');
    var tr = document.createElement('tr');
    tr.appendChild(newTD(x[i].getAttribute("ID")));
    ...
    table.appendChild(tr);
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


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
  •