2 Powerful Ways to Call Ajax Sync and Asyn Request [AJAX]

“How do you use AJAX”? 

“How to call Synchronous and Asynchronous Requests”?

The AJAX stands for “Asynchronous JavaScript and XML” and "AJAX" is a technique to creating interactive web applications and allows us to send and receive data asynchronously without refreshing the web page. more..

Example for calling “Synchronous” and “Asynchronous” Requests!

//AJAX Synchronous and Asynchronous Requests.

//#REGION NAMESPACE
var demo = demo || {};
//#ENDREGION

demo.ajax = demo.ajax || (function () {

    var getBaseURL = function () {
        var currentBaseURL = location.protocol + "//" + location.hostname +
            (location.port && ":" + location.port) + "/";
        return currentBaseURL;
    };

    var baseURL = getBaseURL();
    var request_token;

    var ajaxAsyncCall = function (requestURL, typeGP, inputs, request_token) {

        $.ajax({
            url: requestURL,
            type: typeGP,
            contentType: "application/json; charset=utf-8",
            data: inputs,
            beforeSend: function (xhr) {
                xhr.setRequestHeader("Request_Token", request_token)
            },
            async: true,
            cache: false,
            success: function (data) {
                if (data !== undefined && data !== null) {
                    if (data.Code == "OK") {
                        alert("Success");
                        return false;
                    }
                    else if (data.Code == "ERROR") { 
                        alert('Error - ' + data.Message);
                        return false;
                    }
                }
            }
        });
    };

    var ajaxSyncCall = function (requestURL, typeGP, inputs, request_token) {

        $.ajax({
            url: requestURL,
            type: true,
            contentType: "application/json; charset=utf-8",
            data: inputs,
            beforeSend: function (xhr) {
                xhr.setRequestHeader("Request_Token", request_token)
            },
            async: false,
            cache: false,
            success: function (data) {
                if (data !== undefined && data !== null) {
                    if (data.Code == "OK") {
                        alert("Success");
                        return false;
                    }
                    else if (data.Code == "ERROR") { 
                        alert('Error - ' + data.Message);
                        return false;
                    }
                }
            }
        });
    };

    return {
        baseURL:baseURL,
        ajaxAsyncCall: ajaxAsyncCall,
        ajaxSyncCall: ajaxSyncCall
    }
})();

//Use of common Synchronous and Asynchronous methods.

//GET CUSTOMERS LIST WITH SYNC CALL.
demo.ajax.ajaxSyncCall(demo.ajax.baseURL + "API/Users/GetUsersRequest", 'GET', null, function (data) {
    if (data != undefined) {
        successGetCustomers(data);
    }
}, null);

//GET CUSTOMERS LIST WITH ASYNC CALL.
demo.ajax.ajaxAsyncCall(demo.ajax.baseURL + "API/Users/GetUsersRequest", 'GET', null, function (data) {
    if (data != undefined) {
        successGetCustomers(data);
    }
}, null);

//Success Method
var successGetCustomers = function (data) {
    if (data) {
        console.log(data);
        //TODO: As PER YOU!
    }
};

I hope you are enjoying with this post! Please share with you friends. Thank you!!!