AJAX setTimeout

[JamieHowarth0]

Hi folks,

I have a bit of a headache. I've finally added all the nice finishing touches to my own website (static only with a bit of DHTML).
Now I've just converted the whole thing to AJAX with a couple of simple functions and links changed here and there.
However, I want to create a really cool effect with my AJAX - which is I want to induce a "delay" so people actually see the "loading" section, cause at the moment, it's doing it at about 0.01ms and flashes across the screen before you have a chance to read it.

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;
}
 
var myBodyAjax = new GetXmlHttpObject();
var myOCAjax = new GetXmlHttpObject();
var myURL, myParams, myMethod, myContainer, myWaitingContainer, myAJObject
var thisAJ, thisCont, thisWaitCont
var myAJ, myCont, myWait
 
function doAjax(myURL, myParams, myMethod, myContainer, myWaitingContainer, myAJObject) {
if (myAJObject==null) {
    alert ("Your browser does not support AJAX!");
    return;
}
myAJObject.onreadystatechange=function(){stateChanged(myAJObject, myContainer, myWaitingContainer)};
switch (myMethod) {
    case "get":
        myAJObject.open("GET",myURL+"?"+myParams,true);
        myAJObject.send(null);
        break;
    case "post":
        myAJObject.open("POST",myURL,true);
        myAJObject.send(myParams);
        break;
    default:
        alert("AJAX data method not specified - please email [e-mail]");
}
myAJObject.close;
}
 
function stateChanged(thisAJ, thisCont, thisWaitCont) {
switch (thisAJ.readyState) {
    case 4:
        var timer = setTimeout('function(){showContent(thisAJ,thisCont,thisWaitCont)}',2000);
        break;
    default:
        thisWaitCont.style.visibility = "visible";
}
}
 
function showContent(myAJ, myCont, myWait) {
    myWait.style.visibility='hidden';
    myCont.innerHTML = myAJ.responseText;
}
 

The problem is happening at setTimeout - for whatever reason, it's not being called. I've tried taking the parameters out of quotes but they're AJAX and HTML objects and so aren't handled correctly, and I've used the function() part to force the setTimeout method to accept the function parameters, but still to no avail.
Any help would be much appreciated.

Many thanks,

Benjamin

[JamieHowarth0]

Hi all,

I solved the problem myself! I added a section of ASP code to my AJAX content-serving page:

Dim startTime
startTime = Now()
Do While DateDiff("s",startTime,Now()) < 5
       'Do absolutely nothing!
Loop
 

This made the page wait for exactly 5 seconds before continuing with processing ASP commands.
However, I'd still be very interested if anyone can provide a Javascript solution to the problem.

medicineworker

[acoder]

You may be looking for script.aculo.us.

[JamieHowarth0]

You may be looking for script.aculo.us.

Hi acoder,

Thanks for the link, but I'm not looking to use a JS library - I want to have control over my code and not be reliant upon third-party components to produce the functionality I require for (what should be) a relatively simple requirement.
Is there not just a simple way in JS of setting the AJAX stateChanged functions to be called after a pre-defined time delay?

Many thanks,

medicineworker