Question

A brainteaser for you.

I’ve written this generic JS function. Our system does all of the business logic through AJAX and I’m consolidating the code into a single function so I don’t have to update or maintain 3million+ identical copies of the code across the codebase.

doRequest = function (data,msgBoxElem,origin) {
$.ajax({
  type: "POST",
  url: window.dispatcher_addr,
  data: data,
  dataType: "xml",
  contentType: "text/xml",
  processData: false,      
  success: function(xml) {
    $(msgBoxElem).html(xml.documentElement.getAttribute("msg"));
    location.reload();
  },
  error:function (xhr, ajaxOptions, thrownError){ if (thrownError != 200) {
    var Data = new Array();
    Data["errorcode"]       = xhr.status;
    Data["errortext"]       = thrownError;
    Data["calling_script"]  = origin;
    $.ajax({
      type: "POST",
      url: window.dispatcher_addr,
      data: CreatePayLoad('jslogerror',Data),
      dataType: "xml"        
    });
    }      
  }       

});
}

Now, some of the pages have specific logic that executes in the success, error, and complete handlers for $.ajax(). What I want to know is that if it’s possible to pass in an argument to $.ajax() and then it will execute the custom handler.

Thanks a lot.

Midiane.

Answer 1

You can just add one or more callback arguments to your function like this that will either replace your default handlers or execute in addition to them (your choice how you implement it). Here’s an example of an fnSuccess callback that executes in addition to the default behavior you’ve defined:

doRequest = function (data,msgBoxElem,origin,fnSuccess) {
    $.ajax({
      type: "POST",
      url: window.dispatcher_addr,
      data: data,
      dataType: "xml",
      contentType: "text/xml",
      processData: false,      
      success: function(xml) {
        $(msgBoxElem).html(xml.documentElement.getAttribute("msg"));
        fnSuccess();
        location.reload();
      },
      error:function (xhr, ajaxOptions, thrownError){ if (thrownError != 200) {
        var Data = new Array();
        Data["errorcode"]       = xhr.status;
        Data["errortext"]       = thrownError;
        Data["calling_script"]  = origin;
        $.ajax({
          type: "POST",
          url: window.dispatcher_addr,
          data: CreatePayLoad('jslogerror',Data),
          dataType: "xml"        
        });
        }      
      }       
    }); 
}

Or, if you wanted the caller’s code to execute instead of your default implementation, you could do it like this:

doRequest = function (data,msgBoxElem,origin,fnSuccess) {
    $.ajax({
      type: "POST",
      url: window.dispatcher_addr,
      data: data,
      dataType: "xml",
      contentType: "text/xml",
      processData: false,      
      success: function(xml) {
          if (fnSuccess) {
              fnSuccess(xml);
          } else {
              $(msgBoxElem).html(xml.documentElement.getAttribute("msg"));
              location.reload();
          }
      },
      error:function (xhr, ajaxOptions, thrownError){ if (thrownError != 200) {
        var Data = new Array();
        Data["errorcode"]       = xhr.status;
        Data["errortext"]       = thrownError;
        Data["calling_script"]  = origin;
        $.ajax({
          type: "POST",
          url: window.dispatcher_addr,
          data: CreatePayLoad('jslogerror',Data),
          dataType: "xml"        
        });
        }      
      }       
    }); 
}