dado Posted November 17, 2005 Share Posted November 17, 2005 Hi folks, my first post here... and a real beginner in JS. I really hope you can help me. I'm going to realize a web page where the content should change just reading some text from a file and putting it in a cell of a table.Let's say I've already uploaded several files (txt or html) that should be loaded with different links.is there a way to do it?Please help PS: sorry for my bad english Link to comment Share on other sites More sharing options...
hacknsack Posted November 19, 2005 Share Posted November 19, 2005 This example uses an xml request to fill a table cell.Create 4 text (.txt) files RAM, Hard Disk, CDROM and Mouse that contain your info,save them to the same directory as the following page.When you mouseover the device name the definition will be retreived and placed in a cell. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><html><head> <title>W3 Schools Definition Fetcher</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css">.def_list { background-color: #3A73B1; color: #D7356D; }.def_list td{ background-color: #D0DFF0; padding: 8px; }.active_word{ background-color: #D0DFF0; color: #FF8040; padding: 8px; } </style><script type="text/javascript">/** jibbering.com **/var xmlhttp;/*@cc_on @*//*@if (@_jscript_version >= 5) try { xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } catch (E) { xmlhttp=false; } }@else xmlhttp=false;@end @*/if (!xmlhttp && typeof XMLHttpRequest!='undefined') { try { xmlhttp = new XMLHttpRequest(); } catch (e) { xmlhttp=false; }}/* *** */var prevCell = null;var tmp = 0;function getDef(device, c){if(!xmlhttp) return;var dispObj = document.getElementById('def');var url = encodeURI(device);if(prevCell) { prevCell.className = ''; } dispObj.innerHTML = 'Fetching Data...'; xmlhttp.open("GET", url, true); xmlhttp.setRequestHeader("If-Modified-Since", "Sat, 1 Jan 2000 00:00:00 GMT"); xmlhttp.setRequestHeader("Content-Type", "text/xml"); xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4){ if(xmlhttp.status == 200){ dispObj.innerHTML = xmlhttp.responseText; } else { alert('Try Again..'); return; } } } xmlhttp.send(null);c.className = 'active_word';prevCell = c;}</script> </head><body><table class="def_list"> <tbody> <tr> <td id="def" rowspan="4" width="240"> Mouse Over Device > ><br /> for Definition </td> <td onmouseover="getDef('RAM.txt', this)"> RAM </td> </tr> <tr> <td onmouseover="getDef('Hard Disk.txt', this)"> Hard Disk </td> </tr> <tr> <td onmouseover="getDef('CDROM.txt', this)"> CDROM </td> </tr> <tr> <td onmouseover="getDef('Mouse.txt', this)"> Mouse </td> </tr> </tbody></table> </body></html> Helpful resources:http://developer.mozilla.org/en/docs/AJAX:Getting_Startedhttp://www.onlamp.com/pub/a/onlamp/2005/05...ttprequest.htmlhttp://jibbering.com/2002/4/httprequest.htmlhttp://en.wikipedia.org/wiki/XMLHttpRequest Link to comment Share on other sites More sharing options...
dado Posted November 22, 2005 Author Share Posted November 22, 2005 Hi Hacknsack, thx for your reply. I've just created an example page with the code you provided... but it didn't work.so I started surfing the urls you provided in the post and I wrote this simple code.Unfortunatelly this didn't work as well (along with the html file I saved the test.txt as well) <html><head><title>W3 Schools Definition Fetcher</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><script type="text/javascript">var xmlhttp=false;/*@cc_on @*//*@if (@_jscript_version >= 5)// JScript gives us Conditional compilation, we can cope with old IE versions.// and security blocked creation of the objects. try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (E) { xmlhttp = false; } }@end @*/if (!xmlhttp && typeof XMLHttpRequest!='undefined') { xmlhttp = new XMLHttpRequest();}</head> xmlhttp.open("GET", "test.txt",true); xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4) { alert(xmlhttp.responseText) } } xmlhttp.send(null)<body></body></html> What is wrong??? Any help will be much appreciated Link to comment Share on other sites More sharing options...
hacknsack Posted November 22, 2005 Share Posted November 22, 2005 I think this tutorial may help you:http://www.w3schools.com/xml/xml_http.aspTry the example here:http://www.w3schools.com/xml/tryit.asp?fil...lhttprequest_jsQuestions for you:1) Does the above example work for you(In your browser?)2) Are you trying to use my example locally or did you upload it to a server(with the text files)?3) After studying the W3school example above, tell us which parts you don't understand.The XMLHttpRequest only works when you are interacting with a server.Thanks, Link to comment Share on other sites More sharing options...
Skemcin Posted November 22, 2005 Share Posted November 22, 2005 If you are looking for a really simple solution, try using the <iframe> tag:exampleOr, you could look into Server Side Includes (SSI) - if a scripting language is installed on your server, you most likely have the ability to take advantage of them:example Link to comment Share on other sites More sharing options...
hacknsack Posted November 23, 2005 Share Posted November 23, 2005 Thanks Skemcin, that is a much better(not just simpler) solution.I didn't think of putting an iframe in the table cell.Appreciate the pointer, Link to comment Share on other sites More sharing options...
Skemcin Posted November 23, 2005 Share Posted November 23, 2005 Thanks Skemcin, that is a much better(not just simpler) solution.I didn't think of putting an iframe in the table cell.Appreciate the pointer, Glad to help. Have fun! Link to comment Share on other sites More sharing options...
dado Posted November 23, 2005 Author Share Posted November 23, 2005 Well... I tried the example locally. I still haven't a server where upload the pageI was thinking to develop my page locally first and then upload on a server. As far as the the example is concerned, it is quite clear, I surely need more practice but it is preatty clear. I'll try further with exercisesThanks. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now