ajax()

The ajax() function (client-side) performs synchronous or asynchronous HTTP requests to send and receive data from a server. This function is based on jQuery.ajax and maintains the same behavior and expected results, except when the async property is set to false.

Syntax

Use these syntax formats for the ajax() function:

To pass a string with the URL, use:

                ajax('http://example.com').done(callback);

To pass an object with the request information, use:

                ajax({
    url: string,
    method: string,
    headers: object,
    async: true | false,
    data: object | string,
    dataType: string,
}).done(callback);

Return Value

The ajax() function returns a promise that resolves to a jqXHR object in asynchronous mode, while it returns a string response in synchronous mode. If it can't produce a value, the function returns void.

Parameters

Note:

The url property is required.

If you pass an object as a parameter to the ajax() function, you can include the following properties:

url - Specifies the endpoint URL for the request.
method - Sets the HTTP method for the request, for example, 'GET', 'POST', or 'PUT'. The default method is 'GET'.
headers - An object defining additional HTTP headers to be included in the request.
async - Determines whether the request is processed synchronously or asynchronously. The default value is true. When set to true, the jqXHR object is returned. When set to false, the request is synchronous and returns the response directly.

Note:
For optimal performance, send requests asynchronously.
data - Data to send with the request. For HTTP methods without a body, like GET, data is appended to the URL.

If data is an object, the data string is generated from the object's key-value pairs. For example, { a: "bc", d: "e,f" } is converted to the string "a=bc&d=e%2Cf".

If data is a string, make sure you encode it properly and set the appropriate Content-Type header.
dataType - Specifies the expected data type for the response. For example, this property can take values such as 'json', 'text', 'xml', or 'html'.

Examples

The following examples show how to use the ajax() function.

Sending a POST Request

This example sends a POST request with a JSON string in the request body and logs a message when the request completes.

              ajax({
    url: 'http://example.com/',
    method: 'POST',
    data: '{"key": "value"}',
    headers: {
        "Content-Type": "application/json"
    }
}).done(function() {
    console.log('Request sent');
});

Sending a GET Request

This example sends a GET request that expects a JSON response and logs the parsed data.

              ajax({
    url: 'http://example.com/',
    dataType: 'json'
}).done(function(data) {
    console.log('Response', data);
});

Sending Asynchronous or Synchronous Requests

Note:

For optimal performance, send requests asynchronously.

This example sends an asynchronous request, which doesn't block the page. The server's response is handled in a callback function.

            ajax({
    url: 'https://example.com/'
}).done(function(data) {
    console.log('Server response: ' + data);
});

Instead, a synchronous request like this blocks the page until the request completes.

            var response = ajax({
    url: 'https://example.com/',
    async: false
});
console.log('Server response: ' + response);

Syntax

Return Value

Parameters

Examples

Sending a POST Request

Sending a GET Request

Sending Asynchronous or Synchronous Requests

Related Topics