undefined - Ajax image loader gif

[refreshingcode]

Hello,

I have been trying to get an Ajax script to have a preloader gif run while
the framesets load. No matter what I do it remains undefined and I was looking for help to solve this problem. (I got your DD ajaxcars to work with your loader image fine) but can't do my own. Thank you if you can help.

http://www.thewordgift.com/cisw400/ajaxengine/ajaxtest/new.html

http://www.thewordgift.com/cisw400/ajaxengine/ajaxtest/new.js

http://www.thewordgift.com/cisw400/ajaxengine/ajaxtest/mystyles.css

[jscheuer1]

It's not the image that's undefined, rather outMsg2 - in the code here:


function useResponse()
{

if(req2.readyState == 4 && req2.status == 200)

{
var outMsg2 = req2.responseText;
}

else
{
document.getElementById('updateArea2').innerHTML = '<img src=ajaxloader.gif>';

}

document.getElementById("updateArea2").innerHTML = outMsg2;

}

Regardless of whether or not the request is completed and successful, the last thing the function does is fill updateArea2 with outMsg2. Unless the request is completed and successful, outMsg2 is 'undefined'. Rewrite the function like so:


function useResponse()
{
var outMsg2 = '<img src=ajaxloader.gif>';
if(req2.readyState == 4 && req2.status == 200)
{
var outMsg2 = req2.responseText;
}
document.getElementById("updateArea2").innerHTML = outMsg2;
}

Now the output will always be the loading image, unless the request is completed and successful. Then it will be the contents of the request's response.

Note: The useResponse() function could/should be augmented to deal with other req2.readyState s and other req2.status es. But like I've just made it, should be fine in most cases.

[refreshingcode]

Thank you John! A Javascript wizard!