DayPilot.Calendar.events.load

The events.load() method loads events from a URL using an HTTP request. The endpoint must return a JSON array of event records that follow the DayPilot.Event.data structure.

Declaration

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

Parameters

• url (string) - target URL

• success (function) - callback executed after the response is received and parsed successfully

• error (function) - callback executed when the request fails or the response cannot be parsed

Notes

The request uses HTTP GET by default. The Calendar appends start and end query string parameters that describe the visible date range.

Use DayPilot.Calendar.eventsLoadMethod to switch the request method to POST.

When using POST, the request body contains a JSON object with the visible range (available since version 8.1):

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

The Calendar updates automatically after a successful request. You can cancel the client-side refresh by calling args.preventDefault() in the success callback.

Success Callback

function success(args) {}

The success callback is executed only after the data is received successfully and parsed as a JSON array, but before the Calendar is updated.

Arguments:

• args.preventDefault() - cancels the automatic Calendar update

• args.data (array) - event data returned by the server

Error Callback

function error(args) {}

The error callback is executed for non-200/304 HTTP responses and for JSON parsing failures.

Arguments:

• args.exception (object) - JSON parsing exception

• args.request (XmlHttpRequest) - request object used for the AJAX call

Example

Minimal call:

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

With event handlers:

This example loads events from "/getEvents" and shows a message after the request completes.

const success = (args) => {
  dp.message("Events loaded");
};

const error = (args) => {
  dp.message("Loading failed.");
};

dp.events.load("/getEvents", success, error);

Sample data returned from /getEvents:

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

See Also

DayPilot.Event.data

DayPilot.Calendar.eventsLoadMethod

Event Loading [doc.daypilot.org]

DayPilot.Calendar Class