Skip to main content

AjaxManager

Purpose

The AjaxManager class is a wrapper around the jQuery $.ajax methods, to allow for standard functions to be executed upon success or failure of AJAX requests, and to make it easier to change the styling and availability of elements such as buttons while an AJAX request is ongoing.

Methods

AjaxManager.ajax
// ajaxParams: object containing the normal jQuery ajax parameters other than callbacks
// config: contains extra items, and any callback functions
static ajax(ajaxParams, config = {});

// The ajaxParams you provide are merged with this object, so you do not need to specify
// these fields unless you want to change them.
let defaultAjaxParams = {
  type: "POST",
  dataType: "json",
  data: null,
};

// The config object you provide is merged with this object. The done and fail methods
// are callbacks to be executed on success or failure of the AJAX request.
// standardDone and standardFail determine if the "standard" success and failure methods
// should also be executed upon success or failure of the request.
// Other arguments you can give this function are:
//
// - buttonSelector: the selector for a button to disable/enable, and update the text for, to show 
// the AJAX request proceeding and/or succeeding/failing
//
// - resultDivSelector: the selector for a div in which to show success or failure text for the
// AJAX request.
let defaultConfig = {
  done: null,
  fail: null,
  standardDone: true,
  standardFail: true,
};

// The "standardDone" function.
if (config.standardDone) {
  if (data.error) {
    dcLogger.debug("AJAX request returned with error: %o", data.error);
    $(config.resultDivSelector).text(data.error);
    HtmlTools.setStandardFailureIcon(config.buttonSelector);
  } else if (data.success) {
    HtmlTools.setStandardSuccessIcon(config.buttonSelector);
  }
}

// The "standardFail" function.
if (config.standardFail) {
  dcLogger.debug("AJAX error. XHR: %o Thrown error: %o", jqXHR, thrownError);
  HtmlTools.setStandardFailureIcon(config.buttonSelector);
  $(config.resultDivSelector).text("An internal error occurred. Please try again later.");
}
AjaxManager.ajaxAsync
// The same as the ajax function, but waits for the result of the AJAX
// query instead of using a callback to process the result.
//
// This method returns the response from the AJAX query when it is available.
static async ajaxAsync(ajaxParams, config = {});

Back to top