Ajax Help - reload contents based of user selection

Need to be able to refresh the content at intervals after user selects opti

[jugo]

I have some code that will update a DIV based on a selection from a form.

The user selected the data to display and the information displays ont he DIV.

The data is updated in the database every 60 seconds, so I want theDIV to update itself every 60 seconds as well.

I know I can use the setTimeout() function, but I cannot get it to work.

Here's the .js file I am calling:

var xmlHttp
function showPress(str)
{ 
var value = str
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
 {
 alert ("Browser does not support HTTP Request")
 return
 }
var url="_data.php"
url=url+"?q="+str
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged 
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
// setInterval("showPress(value)", 3000);
}
function stateChanged() 
{ 
if (xmlHttp.readyState==4 ¦¦ xmlHttp.readyState=="complete")
 { 
 document.getElementById("txtHint").innerHTML=xmlHttp.responseText 
 } 
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
 {
 // Firefox, Opera 8.0+, Safari
 xmlHttp=new XMLHttpRequest();
 }
catch (e)
 {
 //Internet Explorer
 try
 {
 xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
 }
 catch (e)
 {
 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
 }
return xmlHttp;
}

[httpwebwitch]

Welcome to WebmasterWorld, jugo!

Leaving aside all the normal routines for requesting AJAX content (new ActiveXObject, etc), setInterval() ought to work for you.

In your code above, if the AJAX call is unsuccessful, setInterval() (which you have commented out - ?) won't happen. It's interrupted by a conditional statement "if(xmlHttp==null)"... but I figure if that was the problem the alert() would make it obvious and you would have mentioned it.

First, isolate your AJAX stuff into a simply named function, and call it directly while debugging. Make sure that it really is working. Attach that function to an onclick listener of a button, so you can trigger it explicitly; when you're satisfied that your AJAX stuff works every time, then move on to the next step.

function do_ajax_stuff(){
// do ajax stuff
}
window.setTimeout("do_ajax_stuff()",3000);

While debugging, throw an alert() into the AJAX routine, so you know if the function is really being called every 60 seconds. Work from the bottom up, building core functions, then wrapping those in logic functions, then attaching those to events that get triggered by user interaction or timers like setInterval(). It does seem like you're on the right path, though I'd recommend staying with setInterval() outside the function, instead of nesting a setTimeout() in a function that calls itself.

One last recommendation - try out one of the client libraries like Mootools, Prototype, Jquery, Dojo, etc; they make all this stuff way easier + you can accomplish in 1 line of code what might otherwise take you 30 if you're doing it "from scratch". It also soothes the problem of typos when you're typing "onreadystatechange" for the billionth time.