SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Evangelist Miguel61's Avatar
    Join Date
    Mar 2008
    Posts
    402
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)

    [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?

    Code:
     
    <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>

  2. #2
    SitePoint Zealot Gar onn's Avatar
    Join Date
    Feb 2011
    Location
    Belgium
    Posts
    130
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    document.getElementById('wait').style.visibility = "visible";

    before you call the ajax function

  3. #3
    SitePoint Evangelist Miguel61's Avatar
    Join Date
    Mar 2008
    Posts
    402
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Gar onn View Post
    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?

    PHP Code:
            var http getHTTPObject();      
            
            function 
    handleHttpResponse() {
            if (
    http.readyState == || 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 myRandtrue);
            
    http.onreadystatechange handleHttpResponse;
            
    http.send(null);
            } 


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •