Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Mar 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    multiple ajax calls simultaneously

    Hey,

    In the following code the function showdivs() is called on body load, though only the second div is loaded. I've been searching on the web for similar problems and I know it has to do with the handler function, which is supposed to be run twice but now just cancels the first function as soon as the second one is called. Could anybody explain me how to solve this?
    TIA,

    Woods
    Code:
    var time_variable;
     
    function getXMLObject()  //XML OBJECT
    {
       var xobject = false;
       try {
         xobject = new ActiveXObject("Msxml2.XMLHTTP")  // For Old Microsoft Browsers
       }
       catch (e) {
         try {
           xobject = new ActiveXObject("Microsoft.XMLHTTP")  // For Microsoft IE 6.0+
         }
         catch (e2) {
           xobject = false   // No Browser accepts the XMLHTTP Object then false
         }
       }
       if (!xobject && typeof XMLHttpRequest != 'undefined') {
         xobject = new XMLHttpRequest();        //For Mozilla, Opera Browsers
       }
       return xobject;  // Mandatory Statement returning the ajax object created
    }
     
    var xobject = new getXMLObject();    //xmlhttp holds the ajax object
     
     
    function handler() {
        var getdate = new Date();
     
        if(xobject) {
            xobject.open("POST",phpFile,true);
            xobject.onreadystatechange  = function() {
                if (xobject.readyState==4) {
                    if(xobject.status == 200) {
                        document.getElementById(divID).innerHTML=xobject.responseText;
                    }
                    else {
                        alert('error');
                    }
                }
            }
            xobject.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
            xobject.send(postVars);
        } 
    }
     
     
    function showdiv1() {
          divID = "div1"; //define html div
          phpFile = "showdiv1.php"; //define file to be loaded
          postVars = "null"; //define post vars
          new handler();
    }
     
    function showdiv2() {
          divID = "div2"; //define html div
          phpFile = "showdiv2.php"; //define file to be loaded
          postVars = "null"; //define post vars
          new handler();
    }
     
    function showdivs() {
    showdiv1();
    showdiv2();
    }

  • #2
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,395
    Thanks
    12
    Thanked 569 Times in 562 Posts
    Two possible solutions:

    1) use two or more different XMLHttpRequest objects (yours is called xobject) or
    2) queue your requests so that the next request is started only after the previous one has finished (readyState == 4)

  • #3
    New to the CF scene
    Join Date
    Mar 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thanks devnull69,

    First solutions wouldn't be an option for me since I really need to be able to run different functions standalone..

    Second one is exactly what I was hoping somebody would tell me... but could you show me how to create different objects in my code? I tried different ways but didn't succeed. thanks

  • #4
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,395
    Thanks
    12
    Thanked 569 Times in 562 Posts
    Now I'm confused

    The first solution is the one which creates different objects so I assume you want to know more about it

    Currently you have this line of code
    Code:
    var xobject = new getXMLObject();
    First of all, you can omit the new keyword here as the function already returns a new object. Also, the calls to the handler() function do not need to have the new keyword.
    Code:
    var xobject = getXMLObject();
    You can create more objects like that
    Code:
    var xobject = getXMLObject();
    var xobject2 = getXMLObject();
    Now instead of starting all of the requests with the first object, you can start the second request with the second object and so on.

  • #5
    New to the CF scene
    Join Date
    Mar 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ah I was confused myself, you're right, thanks anyhow...
    Your possible solution only works when there's a fixed number of calls running simultaneously... I fixed it differently though:

    - I made var xobject refer to a different (global) object in the getXMLObject() function.
    - The var xobject is now called inside the handler function

    Code:
    var time_variable;
     
    function getXMLObject()  //XML OBJECT
    {
       var gobject = false;
       try {
         gobject = new ActiveXObject("Msxml2.XMLHTTP")  // For Old Microsoft Browsers
       }
       catch (e) {
         try {
           gobject = new ActiveXObject("Microsoft.XMLHTTP")  // For Microsoft IE 6.0+
         }
         catch (e2) {
           gobject = false   // No Browser accepts the XMLHTTP Object then false
         }
       }
       if (!gobject && typeof XMLHttpRequest != 'undefined') {
         gobject = new XMLHttpRequest();        //For Mozilla, Opera Browsers
       }
       return gobject;  // Mandatory Statement returning the ajax object created
    }
    	
    
    function handler(div) {
    
    	var xobject = new getXMLObject();
    	var randint = Math.random();
    	var getdate = new Date();
    		
    		xobject.open("POST",phpFile,true);
    		xobject.onreadystatechange  = function() {
    			if (xobject.readyState==4) {
    				if(xobject.status == 200) {
    					document.getElementById(div).innerHTML=xobject.responseText;
    				}
    				else {
    					alert('error');
    				}
    			}
    		}
    		xobject.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    		xobject.send(postVars);
    	} 
    
    
    function showdiv1() {
      	divID = "div1"; //define html div
      	phpFile = "showdiv1.php"; //define file to be loaded
      	postVars = "var1=somevalue"; //define post vars
      	handler(divID);
    }
    
    function showdiv2() {
      	divID = "div2"; //define html div
      	phpFile = "showdiv2.php"; //define file to be loaded
      	postVars = "var2=somevalue"; //define post vars
      	handler(divID);
    }
    
    function showdivs() {
    showdiv1();
    showdiv2();
    }


  •  

    Posting Permissions

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