The ability to call different backend programs and have live updates into divs on a page, and here is the code that does it and works on Windows, Firefox and Google Chrome.
<html>
<head>
<style>
#time { position: absolute; top: 100px; left: 10px; border-left: 2px solid grey; border-bottom: 2px solid black; width: 200px; height: 200px }
#blob { position: absolute; top: 100px; left: 300px; border-left: 2px solid gray; border-bottom: 2px solid black; width: 200px; height: 200px }
</style>
</head>
<script type="text/javascript">
function ajaxFunction(myURL,myDIV)
{
var xmlHttp;
try
{
// Firefox, Opera 8.0+, Safari, Chrome
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer 2 versions, capture both
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
alert("Your browser does not support AJAX!");
return false;
}
}
}
xmlHttp.onreadystatechange=function()
{
if(xmlHttp.readyState==4)
{
document.getElementById(myDIV).innerHTML=xmlHttp.responseText;
}
}
xmlHttp.open("GET",myURL,true);
xmlHttp.send(null);
}
</script>
<body>
<form name="myForm">
<p>Magic updating data, go edit the file
<div id=time></div>
<div id=blob></div>
</form>
<script>setInterval("ajaxFunction('cgi-bin/time.pl','time')",5000);</script>
<script>setInterval("ajaxFunction('cgi-bin/stuff.pl','blob')",5000);</script>
</body>
</html>
No comments:
Post a Comment