Introduction


This namespace contains ajax useful helpers. It helps you write much less code in addition to some changes for the button that initiate the ajax request:

  • It'll be disabled. This helpful to prevent sending new ajax request while the first request is in progress
  • It'll show loading icon. This give user a good feedback.

These changes last as long as the ajax request hasn't finished. Once finished, the button automatically restore it's original status.

Note: All ajax helper functions listed below return the jqXHR object returned by $.ajax() which implements the Promise interface. This means that you still can use Promise methods of the jqXHR object. For example: done, fail or always.


Functions



spa.ajax.get(url, data, fn, button)


Initiate get ajax request.

Parameter Type Description
url string The url to submit ajax request to
data string | object Data to send with the request
fn function A success callback function to be executed when ajax request end successfully. This callback is passed the following: (responseData, textStatus, jqXHR)
button string | JQuery Button (that initiated the ajax request) selector as string or as JQuery object. This parameter is used to set loading icon while ajax request is in progress. If you don't want this functionality, simply pass null or undefined

spa.ajax.post(url, data, fn, button)


Initiate post ajax request.

Parameter Type Description
url string The url to submit ajax request to
data string | object Data to send with the request
fn function A success callback function to be executed when ajax request end successfully. This callback is passed the following: (responseData, textStatus, jqXHR)
button string | JQuery Button (that initiated the ajax request) selector as string or as JQuery object. This parameter is used to set loading icon while ajax request is in progress. If you don't want this functionality, simply pass null or undefined

spa.ajax.put(url, data, fn, button)


Initiate put ajax request.

Parameter Type Description
url string The url to submit ajax request to
data string | object Data to send with the request
fn function A success callback function to be executed when ajax request end successfully. This callback is passed the following: (responseData, textStatus, jqXHR)
button string | JQuery Button (that initiated the ajax request) selector as string or as JQuery object. This parameter is used to set loading icon while ajax request is in progress. If you don't want this functionality, simply pass null or undefined

spa.ajax.delete(url, data, fn, button)


Initiate delete ajax request.

Parameter Type Description
url string The url to submit ajax request to
data string | object Data to send with the request
fn function A success callback function to be executed when ajax request end successfully. This callback is passed the following: (responseData, textStatus, jqXHR)
button string | JQuery Button (that initiated the ajax request) selector as string or as JQuery object. This parameter is used to set loading icon while ajax request is in progress. If you don't want this functionality, simply pass null or undefined

spa.ajax.request(verb, url, data, fn, isUpload, options, button)


General request function.

Parameter Type Description
verb string Ajax type. It could be: get, post, put or delete
url string The url to submit ajax request to
data string | object Data to send with the request
fn function A success callback function to be executed when ajax request end successfully. This callback is passed the following: (responseData, textStatus, jqXHR)
isUpload boolean Whereas the request is used to upload file. If isUpload is true, Spacer set ajax attributes: cache, contentType and processData to false
options object Any extra ajax options
button string | JQuery Button (that initiated the ajax request) selector as string or as JQuery object. This parameter is used to set loading icon while ajax request is in progress. If you don't want this functionality, simply pass null or undefined

Error Callback Function


Error callback function for the above ajax helpers is set globally in Spacer options ajaxOnError.
You can set the error callback function using setOptions like so:

spa.setOptions({
    ajaxOnError: function (jqXHR, textStatus, errorThrown) {
        //process ajax error
    },
});