DayPilot.Event.data

The data property holds the raw event data (the original object). Use this structure when passing event data to DayPilot.Event() constructor.

DayPilot Pro

Core properties (all components)

  • id (string or number)

  • text (string)

  • start (DayPilot.Date object or string in ISO 8601 format)

  • end (DayPilot.Date object or string in ISO 8601 format)

  • resource (string or number; optional)

In the Queue component, the start and end properties can be replaced by duration (a DayPilot.Duration object or a number specifying the duration in seconds).

Optional properties (all components except of Queue)

  • areas (array of objects with properties defined in DayPilot.Area class)

  • backColor (string) - defines the event background color using inline background CSS style

  • backImage (string) - defines the background image (CSS syntax)

  • backRepeat (string) - defines the background image repeat rule (CSS syntax)

  • borderColor (string) - defines border color using inline CSS; use "darker" to apply a darker shade of the background color

  • bubbleHtml (string, static bubble HTML)

  • clickDisabled (boolean) - set to true to disable event click

  • contextMenu (DayPilot.Menu object) - custom context menu

  • cssClass (string) - custom CSS class (accepts multiple classes, separated by space)

  • deleteDisabled (boolean) - set to true to disable event deleting using the built-in icon

  • doubleClickDisabled (boolean) - set to true to disable event double click

  • fontColor (string) - defines the foreground color using inline color CSS style

  • hidden (boolean) - set to true to hide the event

  • html (string) - sets the raw HTML (if not specified, HTML-encoded value of text is used)

  • moveDisabled (boolean) - set to true to disable event moving

  • recurrent (boolean) - used in ASP.NET WebForms, ASP.NET MVC and Java versions (read-only)

  • recurrentMasterId - recurrent master id, used in ASP.NET WebForms, ASP.NET MVC and Java versions (read-only)

  • resizeDisabled (boolean) - set to true to disable event resizing

  • rightClickDisabled (boolean) - set to true to disable event right click

  • sort (array of strings) - defines values used for sorting

  • tags (object) - object that stores custom event properties

  • toolTip (string) - if not specified, text value is used

Optional properties (Scheduler)

  • barBackColor (string) - CSS color of the event bar foreground

  • barColor (string) - CSS color of the event bar background

  • barHidden (boolean) - use true to hide the event bar

  • bubbleHtml (string) - HTML content of the bubble that appears on hover

  • clickDisabled (boolean) - use true to disable event click

  • complete (number) - progress percentage that will be used for the event bar in percent complete mode

  • container (string or number) - specifies the container id; available since 2019.4.4052

  • height (number) - custom height in pixels; available since 7.9.1266

  • htmlLeft (string) - the HTML displayed next to the event, on the left side

  • htmlRight (string) - the HTML displayed next to the event, on the right side

  • line (number or "dedicated") - forced line position within a row - see scheduler event placement strategies

  • linkCreateDisabled (boolean) - disables drag and drop link creation for this event (no link points will be visible on hover); available since 2023.2.5567

  • moveVDisabled (boolean) - use true to disable vertical moving

  • moveHDisabled (boolean) - use true to disable horizontal moving

  • versions (array of objects) - defines event versions; each item can have the following properties: areas, start, end, text, html, backColor, fontColor, borderColor, backImage, backRepeat, complete, barColor, barBackColor, barImageUrl, barHidden, htmlRight, htmlLeft, cssClass, toolTip

Optional properties (Calendar)

  • allday (boolean)

  • barColor (string)

  • barBackColor (string)

  • barHidden (boolean)

  • durationBarImageUrl (string; ignored in cssOnly mode)

Optional properties (Queue)

  • areas (array of objects with properties defined in DayPilot.Area class)

  • backColor (string)

  • backImage (string)

  • backRepeat (string)

  • barColor (string)

  • barHidden (boolean)

  • borderColor (string)

  • bubbleHtml (string, static bubble HTML) - available since 2022.4.5467

  • contextMenu (DayPilot.Menu)

  • cssClass (string)

  • fontColor (string)

  • html (string; if not specified, text is used)

DayPilot Lite

Core properties (all components)

Optional properties (Calendar)

  • backColor (string)

  • barBackColor (string)

  • barColor (string)

  • barHidden (boolean)

  • borderColor (since 1.3.205)

  • cssClass (string)

  • fontColor (string; since 1.3.205)

  • html (string)

  • resource (string or number)

  • tags (object) - object that stores custom event properties

  • toolTip (string)

Optional properties (Month)

  • backColor (string; since 1.2.172)

  • borderColor (string; since 1.3.215)

  • cssClass (string; since 1.2.172)

  • fontColor (string; since 1.3.215)

  • html (string)

  • tags (object) - object that stores custom event properties

  • toolTip (string)

Example

const data = {
  id: 1,
  start: "2023-12-01T09:00:00",
  end: "2023-12-01T13:00:00",
  text: "Event 1",
  cssClass: "my-event",
  resizeDisabled: true
};

const e = new DayPilot.Event(data);

Storing Custom Properties

In order to avoid collision with property names that might be added in the future it is recommended to store custom properties in the tags object:

const data = {
  id: 1,
  start: "2023-12-01T09:00:00",
  end: "2023-12-01T13:00:00",
  text: "Event 1",
  cssClass: "my-event",
  resizeDisabled: true,
  tags : {
    category: "category1"
  }
};

const e = new DayPilot.Event(data);

You can access the custom tag values using DayPilot.Event.tag() method:

const category = e.tag("category");  // "category1"