Where does the jquery ajax success callback return to?

I have written a request method that makes an ajax call, detects if I have supplied a callback or returns the datanode of the response XML.

Request Method:

function request(request, dontRefresh)
{     
   var requestXML = poseRequestXML(request); 
   $.ajax({
      url: 'someProcessor.php',
      type: 'POST',
      cache: false,
      async: dontRefresh,
      timeout: 5000,
      data: "query="+requestXML,
      success: function(response)
      {
         //parses xml into a js object
         var responseObj = parseResponseXML(response);

         if(request.callback){
            request.callback(responseObj);
         } else {
            // responseObj.response[0].data[0] is the data 
            // node of the response Obj.
            // this is what i see being the problem - 
            // I DON'T KNOW WHERE THIS IS RETURNED TO!!
            return responseObj.response[0].data[0];
         }
      }
   });
}

This request would use the callback

var requestObj = new Object();
    requestObj.callback = function(responseObj){someCallbackFunction(responseObj);};
    requestObj[0] = new Object();
    requestObj[0].module = "someModule";
    requestObj[0].action = "someModuleMethod";
request(requestObj);
//results are returned to the function someCallbackFunction()

This is an example of what i'd like to acplish

var requestObj = new Object();
    requestObj[0] = new Object();
    requestObj[0].module = "userManager";
    requestObj[0].action = "GET_USERID";

var userId = request(requestObj, false); //make the request asynchronous

I've tried returning the $.ajax() function itself... like so:

function request(request, dontRefresh){
   return $.ajax({/*...options...*/);
}

But this bypasses the xml parser I have developed and returns the XHR object. I would like to use this kind of technique to register variables. So essentially...

I will be using this method with a callback or setting a variable with it.

Where does the jquery ajax success callback return to?

I have written a request method that makes an ajax call, detects if I have supplied a callback or returns the datanode of the response XML.

Request Method:

function request(request, dontRefresh)
{     
   var requestXML = poseRequestXML(request); 
   $.ajax({
      url: 'someProcessor.php',
      type: 'POST',
      cache: false,
      async: dontRefresh,
      timeout: 5000,
      data: "query="+requestXML,
      success: function(response)
      {
         //parses xml into a js object
         var responseObj = parseResponseXML(response);

         if(request.callback){
            request.callback(responseObj);
         } else {
            // responseObj.response[0].data[0] is the data 
            // node of the response Obj.
            // this is what i see being the problem - 
            // I DON'T KNOW WHERE THIS IS RETURNED TO!!
            return responseObj.response[0].data[0];
         }
      }
   });
}

This request would use the callback

var requestObj = new Object();
    requestObj.callback = function(responseObj){someCallbackFunction(responseObj);};
    requestObj[0] = new Object();
    requestObj[0].module = "someModule";
    requestObj[0].action = "someModuleMethod";
request(requestObj);
//results are returned to the function someCallbackFunction()

This is an example of what i'd like to acplish

var requestObj = new Object();
    requestObj[0] = new Object();
    requestObj[0].module = "userManager";
    requestObj[0].action = "GET_USERID";

var userId = request(requestObj, false); //make the request asynchronous

I've tried returning the $.ajax() function itself... like so:

function request(request, dontRefresh){
   return $.ajax({/*...options...*/);
}

But this bypasses the xml parser I have developed and returns the XHR object. I would like to use this kind of technique to register variables. So essentially...

I will be using this method with a callback or setting a variable with it.

• javascript
• jquery
• ajax
• callback

2 Answers 2

It gets returned to jquery, and jquery discards it. If you want to make your code stop until something has been loaded, use synchronous ajax. But that makes the page irresponsive until the ajax request is plete, so please don't do it!

Example of synchronous ajax (without jquery):

var ajax=new XMLHttpRequest();
ajax.open("GET", url, false);
ajax.send(null);
return ajax.responseText;

Note: For IE patibility, this gets a little bit more plicated, this is just a proof of concept. And this would be the jquery way of doing it: How can I get jQuery to perform a synchronous, rather than asynchronous, Ajax request?

From your perspective, the function does not return to anywhere. Return values are lost.

The key with asynchronous processing is that you handle any data associated with an event in the event handler, or pass it on from there.

  /* ... */
  success: function(response)
  {
     //parses xml into a js object
     var responseObj = parseResponseXML(response);

     if(request.callback){
        request.callback(responseObj);
     } else {
        /* do something with the data */
        setUserId(responseObj.response[0].data[0]);
     }
  }

Where setUserId() is a function that does something useful, as soon as the user ID is available.

As an aside, you should probably not use responseObj.response[0].data[0] without making sure first that that value actually exists.