[Ajax] Please wait and progress bar

Hi all, I need ur appreciated help.

This code no errors but not working because I don’t see the progressBarLong.gif (Please Wait), but I see instantly the alert The server script has now completed and redirect in the server-side page where right output of the form.

Can u help me?


 
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
 
<script language="javascript" type="text/javascript"> 
 
        var url = 'default-1.asp?rand=';
        
        function getHTTPObject()
        {
        try {
        req = new XMLHttpRequest();
          } catch (err1)
          {
          try {
          req = new ActiveXObject("Msxml12.XMLHTTP");
          } catch (err2)
          {
          try {
            req = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (err3)
            {
	req = false;
            }
          }
	}
        return req;
	}
        
        var http = getHTTPObject();      
        
        function handleHttpResponse() {
        if (http.readyState == 4 && http.status==200) {
              document.getElementById('wait').style.visibility = "hidden";
              alert('The server script has now completed');
           } else {
              document.getElementById('wait').style.visibility = "visible";
            }
        }
 
        function longcall() {
        myRand=parseInt(Math.random()*999999);
        http.open("GET", url + myRand, true);
        http.onreadystatechange = handleHttpResponse;
        http.send(null);
        }
        
 
       
function PopUp() {
 
   var w = 400;
   var h = 400;
   var l = Math.floor((screen.width-w)/2);
   var t = Math.floor((screen.height-h)/2);
 
   finestra=window.open('mystartpage.asp','','width=' + w + ',height='+ h + ',top=' + t + ',left=' + l+',scrollbars=no,menubar=no,toolbar=no,status=no');
 
}
 
function atLeastOneChecked(form) {
 
   var inputs = form.getElementsByTagName('input');
   var i = inputs.length;
   while (i--) {   
      
      if(inputs[i].checked && !inputs[i].disabled)
      
         if(confirm("Confirm????.")) {
            PopUp();             
            return false;
            } else {
            return true; 
            }          
   }
   
   alert("ko!")
   return false;
 
}
 
 
</script>
 
</HEAD>
<title>Multiple checkbox select sample</title>
<BODY>
 
 
 
<form name=frmTest action="default-2.asp" method=POST onsubmit="return (atLeastOneChecked(this) && longcall());">
 
 
<input type=CHECKBOX name=chkParent1 value="3742">karla_c26<br>
 
<input type=CHECKBOX name=chkParent2 value="4430">AleAlvarez<br>
 
<input type=CHECKBOX name=chkParent3 value="3303">Alejandra<br>
 
<input type=CHECKBOX name=chkParent4 value="3720">Angio<br>
 
<input type=CHECKBOX name=chkParent5 value="3">gino<br>
 
<input type=CHECKBOX name=chkParent6 value="4606">Andrea<br>
 
<input type=CHECKBOX name=chkParent7 value="3962">alx<br>
 
<input type=CHECKBOX name=chkParent8 value="4095">ANGELADAUTO<br>
 
<input type=CHECKBOX name=chkParent9 value="7">chinga cas<br>
 
<input type=CHECKBOX name=chkParent10 value="8">assim<br>
 
 
<input type=HIDDEN name=txtCount value="10">
<input type=HIDDEN name=comments value=0>
 
<p><input type=SUBMIT value="Select"></p>
</form>
 
<div id="wait" style="background-color:white;position:absolute;top:240px;left:360px;width:70px;height:50px;visibility:hidden;border: 1px solid black;padding:20px;">
<img src="progressBarLong.gif" style="position:relative;top:0px;left:25px">
<br /><br />Please wait...
 
</div>
 
</BODY>
</HTML>
 

document.getElementById(‘wait’).style.visibility = “visible”;

before you call the ajax function

Sorry I don’t understand your suggestion…

This one is first of the function longcall() ajax…
document.getElementById(‘wait’).style.visibility = “visible”;

Can you explain better?

        var http = getHTTPObject();      
        
        function handleHttpResponse() {
        if (http.readyState == 4 || http.readyState=="complete") {
              document.getElementById('wait').style.visibility = "hidden";
              alert('The server script has now completed');
           } else {
              document.getElementById('wait').style.visibility = "visible";
            }
        }


        function longcall() {
        myRand=parseInt(Math.random()*999999);
        http.open("GET", url + myRand, true);
        http.onreadystatechange = handleHttpResponse;
        http.send(null);
        }