asked on

javascript cannot show a wait layer while doing ajax

I am trying to popup a message that says getting data, please wait..... in a div(mess) that I am making visible and then when the ajax call is done, I want to hide the message div(mess) and display the results in a display div(disp). The problem is that it only updates the screen after the ajax call. If I do not rehide the message div, they both show up after the ajax call. What do I need to do to fix this? I have also tried to update the innerhtml just for the disp div and it will only show the final assignment. I also tried breaking it into multiple functions, but that did not help.
Here is my code:

function showfonts(){
document.getElementById("mess").style.left = document.body.scrollLeft+200;
document.getElementById("mess").style.top = document.body.scrollTop+500;
document.getElementById("mess").style.visibility = 'visible';
document.getElementById("disp").style.left = document.body.scrollLeft;
document.getElementById("disp").style.top = document.body.scrollTop;
document.getElementById("disp").style.visibility = 'visible';
var DATETIME = new Date().getTime();
arg = 'someajaxcall'
if (window.XMLHttpRequest) {objHTTP = new XMLHttpRequest()} else
{
if (window.ActiveXObject){objHTTP = new ActiveXObject("Msxml2.XMLHTTP")} else {objHTTP = new ActiveXObject("Microsoft.XMLHTTP")}
}
objHTTP.open("GET", arg, false);
objHTTP.send('');
tvar = objHTTP.responseText.substring(objHTTP.responseText.indexOf('<HTML>')+6,objHTTP.responseText.indexOf('</HTML>'));
document.getElementById("disp").innerHTML = tvar;
document.getElementById("mess").style.visibility = 'hidden';
return;
}

ASKER CERTIFIED SOLUTION

netsmithcentral

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

troyd1

ASKER

This code works perfectly! Thanks for the help and the education. I have a few other open javascript questions if you would like to help.

Thanks, Troy