Clever Geek Handbook

Exec before every ajax success callback

I have a site where I rely on a lot of custom API calls. My API always returns XML.

Currently at the beginning of every $ .get or $ .post I call, I have this snippet:

var root = $($.parseXML(data)).find("Response");

if (root.children("Type").text() == "Error") {
  toastr.error(root.children("Content").text(), "Error " + root.children("ReturnCode").text());
  return;
}

However, I feel that this code is a lot redundant in one of my pages, it has been used 15 times.

I tried using $ (document) .ajaxSuccess () but event.stopPropagation doesn't seem to work here

Is there a way to "intercept" every response to the ajax call, do some things, and possibly prevent other defined success functions from being called?

+3


source to share


1 answer


I assume you have something like this in many places in your code.

$.ajax({
    method: "GET",
    url: "someurl.html",
    dataType: "xml",
    success : function() {
        var root = $($.parseXML(data)).find("Response");
        if (root.children("Type").text() == "Error") {
          toastr.error(root.children("Content").text(), "Error " + root.children("ReturnCode").text());
          return;
        }
        // ...
    },
    error : function(qXHR, textStatus, errorThrown){
        toastr.error(errorThrown, "Error " + qXHR.status);
    }
});

you can create a generic custom ajax function that you can reuse

function baseAjaxCall(option, sCb) {    
    var ajaxOptions = {
        method: option.method || "GET",
        url: option.url,
        dataType: option.dataType || "xml",
        success : function(data) {
            var root = $($.parseXML(data)).find("Response");
            if (root.children("Type").text() == "Error") {
              toastr.error(root.children("Content").text(), "Error " + root.children("ReturnCode").text());
              return;
            }
            else {
                sCb(root);
            }
        },
        error : function(qXHR, textStatus, errorThrown){
            toastr.error(errorThrown, "Error " + qXHR.status);
        }
    };
    //you can check for optional settings
    if(option.contentType  !== undefined){
        ajaxOptions.contentType = option.contentType;
    }

    $.ajax(ajaxOptions);
}


everywhere in your code you can reuse the baseAjaxCall function

baseAjaxCall({ url: "someurl.html" }, function(root){
 // no need to chek for errors here!
});

Hope it helps!

+2


source






More articles: