DayPilot.Calendar.onBeforeCellRender

The onBeforeCellRender event is fired before the JavaScript Calendar cells are rendered. It lets you customize the cell content and appearance.

Declaration

DayPilot.Calendar.onBeforeCellRender(args);

Parameters

• args.cell.column (DayPilot.Column object) - column details (since version 2025.1.6333)

• args.cell.resource (string | number) [read-only]

• args.cell.start (DayPilot.Date) [read-only]

• args.cell.end (DayPilot.Date) [read-only]

• args.cell.properties (object with customizable cell properties)

• args.cell.x (number) - horizontal position of a grid cell (since version 2024.2.5912)

• args.cell.y (number) - vertical position of a grid cell (since version 2024.2.5912)

Cell properties (args.cell.properties):

• areas (array of area data objects)

• business (boolean)

• cssClass (string)

• backImage (string)

• backRepeat (string)

• backColor (string)

• disabled (boolean)

• fontColor (string) - since version 2024.2.5912

• html (string)

• text (string) - since version 2024.2.5912

The args.cell.properties object is available since 2021.4.5145. In prior versions, these properties are available directly in the args.cell object (e.g. args.cell.cssClass).

Example

onBeforeCellRender: (args) => {
  if (args.cell.start.getHours() === 13) {
      args.cell.properties.backColor = "silver";
  }
};