DayPilot.Scheduler.events.load

The events.load() method loads events from a given URL using an HTTP call (GET or POST, depending on the eventsLoadMethod value). The URL must return a JSON array with events (see DayPilot.Event.data for the event data structure).

For GET requests, the Scheduler will add start and end of the current view as query string parameters. Example:

/getEvents?start=2025-06-15T09:00:00&end=2025-06-15T13:00:00

POST requests will contain the start and end parameters as a JSON object in the request body (since version 8.1):

Example POST body:

{"start": "2025-06-15T09:00:00", "end": "2025-06-15T13:00:00"}

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

Declaration

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

Parameters

• url (string) - URL of the API endpoint

• success (function) - success callback

• error (function) - error callback

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.

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 the /getEvents URL. The current date range is passed in start and end POST 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: "2025-01-01T09:00:00",
  end: "2025-01-01T13:00:00",
  text: "Event 1",
  resource: "A",
  cssClass: "my-event",
  resizeDisabled: true
},
{
  id: 2
  start: "2025-01-02T09:00:00",
  end: "2025-01-02T13:00:00",
  resource: "B",
  text: "Event 2"
}
]