Question

I want to call some javascript functions after all ajax calls. I know how to call the functions inside each individual ajax call as shown below:

function xyz()
{

if (window.XMLHttpRequest)
   {// code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
   }
 else
   {// code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
 xmlhttp.onreadystatechange=function()
   {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
     document.getElementById("links").innerHTML=xmlhttp.responseText;

     *****javacsript would go here*****
   }

 xmlhttp.open("GET","xhr_php/site_links.php",true);
 xmlhttp.send();
 }
 }

so again, i know how to call it after or inside each ajax call as shown above. But i am wondering if there is a function that would call the functions after all/any ajax calls. This way i don’t have to write the javascript inside each ajax call. I think it has something to do with an endrequesthandler but not sure how that is written in php/javascript. I found some thing online as it pertains to asp.net but im using php.

Id also like a way to call functions at the start of the ajax call or before the ajax call.

This way i can start and stop functions during ajax calls without having to write this inside each call.

Thank you for your help.

Answer 1

You can have it take a callback function:

function xyz(callback) {
    var xmlhttp;
    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    }
    else { // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            callback(this);
        }

    }
    xmlhttp.open("GET", "xhr_php/site_links.php", true);
    xmlhttp.send();
}

Then:

xyz( function( xhr ) {

    alert( xhr.responseText );

});