Namespace: ajax

ajax

Manage AJAX requests and HTML form submittion through AJAX.

Dependencies:
  • None

Methods

(static) addInJson(json, key, value) → {Object}

Add the specific value in the json usign the specified key

 portal.ajax.addInJson({}, "key", 123);
 // Produce {"key": 123}


 portal.ajax.addInJson({}, "key[subKey]", 123);
 // Produce
 //  {
 //    "key": {
 //      "subKey": 123
 //    }
 //  }


 portal.ajax.addInJson({}, "key[subKey[subsubKey]]", 123);
 // Produce
 //  {
 //    "key": {
 //      "subKey": {
 //          "subsubKey": 123
 //      }
 //    }
 //  }
Parameters:
Name Type Description
json Object

JSON object to update
key String

Key to add
value Object

Value of the key to add
Returns:

Updated JSON

Type
Object

(static) batch(requests, optionsopt) → {Promise}

Execute several AJAX requests an return a promise with the results in JSON format of each requests.

 portal.ajax.batch([
     {url : "http://my.first.url/", options : {method : "GET"}},
     {url : "http://my.second.url/", options : {method : "DELETE"}},
  ], {
      success : function (request, response) {
          console.log(reqest.url + " succeed");
      },
      error : function (request, response) {
          console.log(reqest.url + " failed");
      }
  }).then((responses) => {
      // when all requests are done
  }).catch((responses) => {
      // When all requests failed
  });
Parameters:
Name Type Attributes Description
requests Array.<Object>

Array of requests to execute

Properties
Name Type Description
url string

URL to request
options Object

Options for the request
options Object <optional>

Options for the batch requests

Properties
Name Type Attributes Description
success function <optional>

Method to execute for each success

Properties
Name Type Attributes Description
requests Object <optional>

Requests which succeed
responses Object <optional>

Response of the successfuly request
error function <optional>

Method to execute for each errors

Properties
Name Type Attributes Description
requests Object <optional>

Requests which failed
responses Object <optional>

Response of the failed request
Returns:

If all the requests failed, the promise will failed.

Type
Promise

(static) fetch(url, options) → {Promise}

Execute an AJAX request and return a promise with the result in JSON format.

 portal.ajax.fetch("//my/urls", {method : "GET"}).then(json => {
     console.log("RESULT:", json);
 }).catch(error => {
     console.error(error);
 });
Parameters:
Name Type Description
url String

Url to request
options Object

Options for the request (look at the documentation of Fetch)

Properties
Name Type Attributes Default Description
method String <optional>
 "POST"

HTTP method
credentials String <optional>
 "include"

Include credentials (HTTP Cookies)
headers Headers <optional>

HTTP headers with Content-type and Accept to application/json
Returns:

Promise with the result in JSON format

Type
Promise

(static) formToJson(elForm, optionsopt) → {Object}

Serialize the form to an JSON object

Parameters:
Name Type Attributes Description
elForm HTMLElement

Form element to parse
options Options <optional>

Option to perform the action

Properties
Name Type Attributes Description
jsonFormatter function <optional>

Callback to format the JSON to send, this method take one object in argument and expect an object as a return value
Returns:

Return the form data in JSON format

Type
Object

(static) makeAllFormsAjax(optionsopt)

Make all forms in the page submittable through AJAX request.

Parameters:
Name Type Attributes Description
options Object <optional>

Options to attach on all forms (events).

Properties
Name Type Attributes Description
beforeSubmit function <optional>

Handler to execute before all forms submission.
submitSuccess function <optional>

Handler to execute on all forms submit success.
submitError function <optional>

Handler to execute on all forms submit errors.

(static) makeFormAjax(elForm, optionsopt)

Make the specified forms submittable with AJAX request.

This method use the method attribute of the HTML Form as the method of the AJAX request.

  const form = document.getElementById("my-form");
  portal.ajax.makeFormAjax(form);

With options:

  const form = document.getElementById("my-form");
  portal.ajax.makeFormAjax(form, {
      beforeSubmit : () => {
          console.log("I will submit....")
      },
      submitSuccess : (event) => {
          console.log("The result is:", event.detail)
      },
      submitError: (event) => {
          console.error(event.detail);
      }
  });
Parameters:
Name Type Attributes Description
elForm HTMLElement

Form element to listen.
options Object <optional>

Options to attach on current form (events).

Properties
Name Type Attributes Description
jsonFormatter function <optional>

Callback to format the JSON to send, this method take one object in argument and expect an object as a return value
beforeSubmit function <optional>

Handler to execute before the form submission.
submitSuccess function <optional>

Handler to execute on the form submit success.
submitError function <optional>

Handler to execute on the form submit errors.

(static) submitForm(elForm, optionsopt) → {Promise}

Submit the specified HTML form using the AJAX request.

This method use the method attribute of the HTML Form as the method of the AJAX request.

Parameters:
Name Type Attributes Description
elForm HTMLElement

Form element to submit
options Options <optional>

Option to perform the action

Properties
Name Type Attributes Description
jsonFormatter function <optional>

Callback to format the JSON to send, this method take one object in argument and expect an object as a return value
Returns:

Promise with the result in JSON format

Type
Promise