Link Loading

Loading link data from an URL

You can load link data in the JavaScript Scheduler using a shortcut links.load() method:

links.load(`/api/links`);

This method loads the link data from the remote URL.

It automatically adds the visible date range to the specified URL as start and end query string parameters. That lets you limit the events when loading the data from a database on the server side.

Loading link data from a custom source

You can also load event data manually and update the Scheduler to display them:

const {data: events} = await DayPilot.Http.get(`/api/links`);
dp.update({links});

If you load multiple data sets (e.g. resources, events, and links) at the same time it's better to merge all asynchronous HTTP calls using Promise.all() and update the Scheduler component only once.

Data format

The link data object must specify the source and target event ID using the from and to properties. The event type (FinishToStart, StartToString, StartToFinish, FinishToFinish) is optional - if not specifies, the Scheduler uses “FinishToStart”:

const list = [
  {
    from: 1, 
    to: 2, 
    type:"FinishToStart", 
    color: "green"
  }
);

You can customize the link appearance using additional properties, such as color. All available properties are listed in the DayPilot.Link.data object documentation.

Invalid Loading Responses

In Pro since version 2026.4.7086, collection loading methods reject empty response bodies, malformed JSON and JSON values that are not arrays. Return [] when the collection is empty.

Supply an error callback to handle these failures. Its args.request is the original XMLHttpRequest; args.exception provides a parsing or validation exception when applicable. The success callback is not called and the existing collection is retained.

dp.links.load("/api/links", null, args => {
  console.error("Loading failed", args.request.status, args.exception);
});