DayPilot.Month.events.load

The events.load() method loads events from a given URL using an AJAX call. The URL must return a JSON array with events (see DayPilot.Event.data for the event data structure).

Declaration

DayPilot.Month.events.load(url[, success[, error]]);

Parameters

• url (string) - the URL
• success (function) - success callback
• error (function) - error callback

Notes

The HTTP call uses GET request by default. The calendar adds start and end parameters (that specify the visible start and end) to the query string.

You can also use eventsLoadMethod to switch to POST request.

The POST request sends the following parameters as a JSON object (since version 8.1):

• start: visible start
• end: visible end

Example POST body:

{"start": "2022-05-30T00:00:00", "end": "2022-07-04T00:00:00"}

The monthly calendar is updated automatically after a successful AJAX call. You can cancel the client-side refresh by calling args.preventDefault() in the success callback function.

Success Callback

function success(args) {}

The success callback is only executed if the data is successfully received from the URL and it can be parsed as a JSON array. It is executed after the response is received but before the calendar is updated. You can cancel the calendar update by calling args.preventDefault().

Arguments:

• args.preventDefault()
• args.data (array) - event data received from the server

Error CallBack

function error(args) {}

The error callback is executed when the HTTP return code is other than 200 or 304 or if there is an exception during parsing the JSON data.

Arguments:

• args.exception (object) - JSON data parsing exception
• args.request (XmlHttpRequest) - the request object used for the AJAX call

Examples

Minimal example

dp.events.load("/getEvents");

Example with event handlers

This example will load events from /getEvents URL. The current date range is passed in start and end query string parameters.

dp.events.load(
  "/getEvents",
  function success(args) {
    dp.message("Events loaded");
  },
  function error(args) {
    dp.message("Loading failed.");
  }
);

Sample data returned from /getEvents:

[
{
  id: 1
  start: "2022-01-01T09:00:00",
  end: "2022-01-01T13:00:00",
  text: "Event 1",
  cssClass: "my-event"
},
{
  id: 2
  start: "2022-01-02T09:00:00",
  end: "2022-01-02T13:00:00",
  text: "Event 2"
}
]