Forum Moderators: open

Message Too Old, No Replies

Dynamically update values from the server

Using DOM and a server-pull

         

Nedals

12:58 am on Jan 25, 2005 (gmt 0)

10+ Year Member



Not a noobie, but new to this forum.

Below is a 'test' script.
'data.txt' is to be replaced with a CGI script.
In the final script the value will be updated every 10 secs. Hence the 'removeChild'

This script seems to work somewhat in both IE and Mozilla but I have several problems that I do not understand.

1. The script (with the sections commented out as shown) works as expected in IE. In Mozilla I need to click the 'change value' button twice to get the update. If I use the 10mSec timeout instead that problem goes away.
2. When I add the <base href...> plus a new path for the 'data.txt' (only used for local testing), I get an 'invalid argument' on the '...removeChild' line in IE but it still works in Mozilla.
3. In Mozilla, the 'activity bar' (if that's what you call it) indicates that the page has not fully loaded.

Am I doing something radically wrong? Your comments will be gratefully received.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">
<head><title>Testing</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<!--base href="file://c:/documents/....../"-->
<script type="text/javascript">
<!--
var value = 22;
function get_value() {
script = document.createElement('script'); // Create an element
script.src = "data.txt"; // return data in the form 'values=xx'
script.type = "text/javascript";
// Add script element which automatically updates the value
document.getElementsByTagName('head')[0].appendChild(script);
set_value();
//timer = setTimeout("set_value()",10);
// Now get rid of element so as not to create multiple iterations
document.getElementsByTagName('head')[0].removeChild(script);
return false;
}

function set_value() {
document.getElementById('thevalue').innerHTML = value;
}

window.onload = set_value;
//-->
</script>
</head>

<body>
<button onclick="return get_value()">Change value</button>
<div id="thevalue"></div>
</body>
</html>


OK! so...
How do I put this code in a box?
How do I keep the formatting?

broniusm

9:28 pm on Jan 26, 2005 (gmt 0)

10+ Year Member



Nedals-
I'm just glancing at this, but perhaps the issue lies in the removal of the script block: is it possible that one browser is in fact removing the wrong block?

If the above is found to be true, try creating your script block and adding and ID to it. Then reference it only by that ID. I believe that .appendChild() will append *after* exisiting HEAD child objects. Removing by (script) might, in fact, be referencing the wrong HEAD child obj inadvertently. .. .at least that's what it looks like is happening.

I didn't know you could load strictly a data file by doing script src=datafile.txt. Slick.

Any dynamic data loads I've done, I've done with the http request method.

I'm curious to hear how it goes-- good luck!