mtber Posted June 4, 2009 Share Posted June 4, 2009 I am trying to get my button output to be inserted into the table cell beneth that of the button. my HTML code is posted below. <html><script type="text/javascript" src="test.js"></script><script type="text/javascript" src="revisedtest.js"></script><body><table border="1"><thead>Testing</thead><tr><td><button type="Load" onclick="test()">click me</button></td><td><button type="revised" onclick="revised()">make revised</button></td></tr><tr><td> </td><td> </td></tr></table></body></html> Link to comment Share on other sites More sharing options...
smerny Posted June 4, 2009 Share Posted June 4, 2009 well i cant see what is in your js files, but you could put an id on on the info you want changed... like this for example <td><span id="cell1"> </span></td><td><span id="cell2"> </span></td> Then you could have javascript to change what is within those span tags document.getElementById("cell1").innerHTML=whatever;document.getElementById("cell2").innerHTML=whatever; Link to comment Share on other sites More sharing options...
mtber Posted June 5, 2009 Author Share Posted June 5, 2009 I understand what you are saying but i am not sure how to do this with my .js file. function test(){var xmlDoc=null;if (window.ActiveXObject){// code for IExmlDoc=new ActiveXObject("Microsoft.XMLDOM");}else if (document.implementation.createDocument){// code for Mozilla, Firefox, Opera, etc.xmlDoc=document.implementation.createDocument("","",null);}else{alert('Your browser cannot handle this script');}if (xmlDoc!=null) {xmlDoc.async=false;xmlDoc.load("test.xml");var x=xmlDoc.getElementsByTagName("computer");document.write("<table border='1'>");document.write("<thead>");document.write("<tr><th>Maker</th><th>Price</th><th>Model</th><th>Speed</th></tr>");document.write("</thead>");document.write("<tfoot>");document.write("<tr><th colspan='4'>Computer Parts</th></tr>");document.write("</tfoot>");for (var i=0;i<x.length;i++){ document.write("<tr>");document.write("<td>");document.write(x[i].getElementsByTagName("maker")[0].childNodes[0].nodeValue);document.write("</td>");document.write("<td>");document.write(x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue);document.write("</td>");document.write("<td>");document.write(x[i].getElementsByTagName("model")[0].childNodes[0].nodeValue);document.write("</td>");document.write("<td>");document.write(x[i].getElementsByTagName("speed")[0].childNodes[0].nodeValue);document.write("</td>");document.write("</tr>");}document.write("</table>");}} Link to comment Share on other sites More sharing options...
LaLaLa Posted June 8, 2009 Share Posted June 8, 2009 I understand what you are saying but i am not sure how to do this with my .js file.function test(){var xmlDoc=null;if (window.ActiveXObject){// code for IExmlDoc=new ActiveXObject("Microsoft.XMLDOM");}else if (document.implementation.createDocument){// code for Mozilla, Firefox, Opera, etc.xmlDoc=document.implementation.createDocument("","",null);}else{alert('Your browser cannot handle this script');}if (xmlDoc!=null) {xmlDoc.async=false;xmlDoc.load("test.xml");var x=xmlDoc.getElementsByTagName("computer");document.write("<table border='1'>");document.write("<thead>");document.write("<tr><th>Maker</th><th>Price</th><th>Model</th><th>Speed</th></tr>");document.write("</thead>");document.write("<tfoot>");document.write("<tr><th colspan='4'>Computer Parts</th></tr>");document.write("</tfoot>");for (var i=0;i<x.length;i++){ document.write("<tr>");document.write("<td>");document.write(x[i].getElementsByTagName("maker")[0].childNodes[0].nodeValue);document.write("</td>");document.write("<td>");document.write(x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue);document.write("</td>");document.write("<td>");document.write(x[i].getElementsByTagName("model")[0].childNodes[0].nodeValue);document.write("</td>");document.write("<td>");document.write(x[i].getElementsByTagName("speed")[0].childNodes[0].nodeValue);document.write("</td>");document.write("</tr>");}document.write("</table>");}} I believe what you want is to change all the document.write's to document.getElementById("cell2").innerHTML=document.getElementById("cell2").innerHTML+whateverYouWantToAdd. (Note the "cell2" id for the cell that you want the stuff to be written to.) Just conecate what's already in the second cell with what you are tyring to add. For example:HTML<html><script type="text/javascript" src="test.js"></script><script type="text/javascript" src="revisedtest.js"></script><body><table border="1"><thead>Testing</thead><tr><td><button type="Load" onclick="test()">click me</button></td><td><button type="revised" onclick="revised()">make revised</button></td></tr><tr><td> </td><td id="cell2"> </td></tr></table></body></html> JavaScript document.getElementById("cell2").innerHTML=document.getElementById("cell2").innerHTML+"<table border='1'>";...etc....; I believe this is what you want? Link to comment Share on other sites More sharing options...
mtber Posted June 8, 2009 Author Share Posted June 8, 2009 I believe what you want is to change all the document.write's to document.getElementById("cell2").innerHTML=document.getElementById("cell2").innerHTML+whateverYouWantToAdd. (Note the "cell2" id for the cell that you want the stuff to be written to.) Just conecate what's already in the second cell with what you are tyring to add. For example:HTML<html><script type="text/javascript" src="test.js"></script><script type="text/javascript" src="revisedtest.js"></script><body><table border="1"><thead>Testing</thead><tr><td><button type="Load" onclick="test()">click me</button></td><td><button type="revised" onclick="revised()">make revised</button></td></tr><tr><td> </td><td id="cell2"> </td></tr></table></body></html> JavaScript document.getElementById("cell2").innerHTML=document.getElementById("cell2").innerHTML+"<table border='1'>";...etc....; I believe this is what you want? Ok i get what you are saying...i will try this...thanks for the help.! Link to comment Share on other sites More sharing options...
mtber Posted June 8, 2009 Author Share Posted June 8, 2009 LaLaLa... i tried what you suggested and the table did not get displayed inside of the cell i only get the first item of the xml file and that is all thats displayed. Link to comment Share on other sites More sharing options...
LaLaLa Posted June 8, 2009 Share Posted June 8, 2009 LaLaLa... i tried what you suggested and the table did not get displayed inside of the cell i only get the first item of the xml file and that is all thats displayed.Well yes, that's because I only changed the first line and use "...etc...." to indicate that you needed to make the same changes to the rest of the lines of code in your example. Replace the document.write with what I showed you for everything else. Link to comment Share on other sites More sharing options...
mtber Posted June 9, 2009 Author Share Posted June 9, 2009 Well yes, that's because I only changed the first line and use "...etc...." to indicate that you needed to make the same changes to the rest of the lines of code in your example. Replace the document.write with what I showed you for everything else.I did all of what you suggested and the only thing that it outputs is the headings.function test(){var xmlDoc=null;if (window.ActiveXObject){// code for IExmlDoc=new ActiveXObject("Microsoft.XMLDOM");}else if (document.implementation.createDocument){// code for Mozilla, Firefox, Opera, etc.xmlDoc=document.implementation.createDocument("","",null);}else{alert('Your browser cannot handle this script');}if (xmlDoc!=null) {xmlDoc.async=false;xmlDoc.load("test.xml");var x=xmlDoc.getElementsByTagName("computer");document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"<table border='1'>";document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"<thead>";document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"<tr><th>Maker</th><th>Price</th><th>Model</th><th>Speed</th></tr>";document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"</thead>";document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"<tfoot>";document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"<tr><th colspan='4'>Computer Parts</th></tr>";document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"</tfoot>";for (var i=0;i<x.length;i++){ document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"<tr>";document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"<td>";document.getElementById("cell1").innerHTML=document.write(x[i].getElementsByTagName("maker")[0].childNodes[0].nodeValue);document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"</td>";document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"<td>";document.getElementById("cell1").innerHTML=document.write(x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue);document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"</td>";document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"<td>";document.getElementById("cell1").innerHTML=document.write(x[i].getElementsByTagName("model")[0].childNodes[0].nodeValue);document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"</td>";document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"<td>";document.getElementById("cell1").innerHTML=document.write(x[i].getElementsByTagName("speed")[0].childNodes[0].nodeValue);document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"</td>";document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"</tr>";}document.getElementById("cell1").innerHTML=document.getElementById("cell1").innerHTML+"</table>";}} Link to comment Share on other sites More sharing options...
Ingolme Posted June 9, 2009 Share Posted June 9, 2009 You should really simplify that code. By simplifying it, I found these document.write() statements which are making your program behave incorrectly. The document.write() method erases everything on the page before writing if it's called after the page has loaded.Try this code: function test() { var xmlDoc=null; if (window.ActiveXObject) { xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); } else if (document.implementation.createDocument) { xmlDoc=document.implementation.createDocument("","",null); } else { alert('Your browser cannot handle this script'); } if (xmlDoc!=null) { xmlDoc.async=false; xmlDoc.load("test.xml"); var x=xmlDoc.getElementsByTagName("computer"); el = document.getElementById("cell1"); el.innerHTML += "<table border='1'>"; el.innerHTML += "<thead>"; el.innerHTML += "<tr><th>Maker</th><th>Price</th><th>Model</th><th>Speed</th></tr>"; el.innerHTML += "</thead>"; el.innerHTML += "<tfoot>"; el.innerHTML += "<tr><th colspan='4'>Computer Parts</th></tr>"; el.innerHTML += "</tfoot>"; for (var i=0;i<x.length;i++) { el.innerHTML += "<tr>"; el.innerHTML += "<td>"; el.innerHTML += x[i].getElementsByTagName("maker")[0].childNodes[0].nodeValue; el.innerHTML += "</td>"; el.innerHTML += "<td>"; el.innerHTML += x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue; el.innerHTML += "</td>"; el.innerHTML += "<td>"; el.innerHTML += x[i].getElementsByTagName("model")[0].childNodes[0].nodeValue; el.innerHTML += "</td>"; el.innerHTML += "<td>"; el.innerHTML += x[i].getElementsByTagName("speed")[0].childNodes[0].nodeValue; el.innerHTML += "</td>"; el.innerHTML += "</tr>"; } el.innerHTML += "</table>"; }} Link to comment Share on other sites More sharing options...
mtber Posted June 9, 2009 Author Share Posted June 9, 2009 You should really simplify that code. By simplifying it, I found these document.write() statements which are making your program behave incorrectly. The document.write() method erases everything on the page before writing if it's called after the page has loaded.Try this code:function test() { var xmlDoc=null; if (window.ActiveXObject) { xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); } else if (document.implementation.createDocument) { xmlDoc=document.implementation.createDocument("","",null); } else { alert('Your browser cannot handle this script'); } if (xmlDoc!=null) { xmlDoc.async=false; xmlDoc.load("test.xml"); var x=xmlDoc.getElementsByTagName("computer"); el = document.getElementById("cell1"); el.innerHTML += "<table border='1'>"; el.innerHTML += "<thead>"; el.innerHTML += "<tr><th>Maker</th><th>Price</th><th>Model</th><th>Speed</th></tr>"; el.innerHTML += "</thead>"; el.innerHTML += "<tfoot>"; el.innerHTML += "<tr><th colspan='4'>Computer Parts</th></tr>"; el.innerHTML += "</tfoot>"; for (var i=0;i<x.length;i++) { el.innerHTML += "<tr>"; el.innerHTML += "<td>"; el.innerHTML += x[i].getElementsByTagName("maker")[0].childNodes[0].nodeValue; el.innerHTML += "</td>"; el.innerHTML += "<td>"; el.innerHTML += x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue; el.innerHTML += "</td>"; el.innerHTML += "<td>"; el.innerHTML += x[i].getElementsByTagName("model")[0].childNodes[0].nodeValue; el.innerHTML += "</td>"; el.innerHTML += "<td>"; el.innerHTML += x[i].getElementsByTagName("speed")[0].childNodes[0].nodeValue; el.innerHTML += "</td>"; el.innerHTML += "</tr>"; } el.innerHTML += "</table>"; }} I tried this and my output was just {MakerPriceModelSpeedComputer Parts} that is what was in cell1 Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.