jQuery - Ajax GET Blueprint

GET

Complete blueprint of an GET ajax call. Your callback functions will receive three arguments (all optional) from the call itself.

The optional callback parameter specifies a callback function to run when the given method is completed. The callback function can have three different parameters (name is mutable):

  • responseTxt - contains the resulting content if the call succeeds
  • statusTxt - contains the status of the call
  • xhr - contains the XMLHttpRequest object

https://api.jquery.com/jQuery.ajax/

View the console.

 


async function GetCityWithPointsOfInterest(cityId)
{
    const ajaxConfig =
    {
        url: `https://city-info-api-prod.azurewebsites.net/api/v1.0/cities/${cityId}?includePointsOfInterest=true`,
        type: "GET",
        async: true,        // default
        dataType: "json",   //what we expect back from server
        headers: {
                "Content-Type": "application/json",
                "x-custom-header": "foobar"
        }
    };

    let apiResults = await $.ajax(ajaxConfig)
        .done(function (responseTxt, statusTxt, xhr)
        {
            // success code here
            console.log("DONE callback function");
            console.log("responseTxt");
            console.dir(responseTxt);
            console.log("statusTxt");
            console.dir(statusTxt);
            console.log("xhr");
            console.dir(xhr);

            if (statusTxt === "success")
            {
                console.log("    success!    ");
            }
        })
        .fail(function (xhr, statusTxt, errorThrown)
        {
            // fail code here
            console.log("FAIL callback function");
            console.log("xhr");
            console.dir(xhr);
            console.log("statusTxt");
            console.dir(statusTxt);
            console.log("errorThrown");
            console.dir(errorThrown);
        })
        .always(function (responseTxt, statusTxt, xhr)
        {
            //always executed
            // if success, you get back data, textStatus, jqXHR
            // if fail, you get back XHR, textStatus, errorThrow
            console.log("ALWAYS callback function");
            console.log("responseTxt");
            console.dir(responseTxt);
            console.log("statusTxt");
            console.dir(statusTxt);
            console.log("xhr");
            console.dir(xhr);
        });
    return apiResults;
}