DayPilot.Scheduler.onBeforeResHeaderRender

The onBeforeResHeaderRender event handler fires once for every row during initialization and update, when resources are loaded. See also DayPilot.Scheduler.onBeforeRowHeaderRender, which is called on demand whenever the row header is rendered.

Declaration

DayPilot.Scheduler.onBeforeResHeaderRender(args)

Parameters

• args.resource.areas - active areas

• args.resource.backColor - background color

• args.resource.columns - row header column properties

• args.resource.contextMenu - context menu

• args.resource.cssClass - CSS class

• args.resource.expanded - expanded state

• args.resource.eventHeight - event height

• args.resource.fontColor - font color (available since 2018.2.3224)

• args.resource.html - custom header HTML

• args.resource.id - resource ID (read-only)

• args.resource.loaded - loading state

• args.resource.name - resource name

• args.resource.minHeight - minimum row height

• args.resource.marginBottom - bottom margin

• args.resource.start - row start (read-only)

• args.resource.toolTip - tooltip text

Notes

The args.resource.columns property is an array of column properties. Item structure (available since build 8.1.2007):

• html

• backColor

• cssClass

The args.resource.columns[] index depends on DayPilot.Scheduler.rowHeaderColumnsMode.

Tabular mode

Since version 2019.4.4063, the Scheduler uses Tabular mode for row header columns by default.

• When no columns are defined using DayPilot.Scheduler.rowHeaderColumns, the row header HTML can be set using args.resource.html.

• When columns are defined, the row header HTML can only be set using args.resource.columns[].html. The column numbers correspond to the columns defined using DayPilot.Scheduler.rowHeaderColumns. In this mode, args.resource.html is ignored and you need to use args.resource.columns[0].html instead.

Legacy mode

• The properties of the first (default) column are controlled using args.row. The HTML of the first column is always defined using args.row.html.

• Additional columns are available only when columns are specified using DayPilot.Scheduler.rowHeaderColumns, and they are accessible using args.row.columns[]. That means the second column is available as args.row.columns[0].

Examples

JavaScript

const dp = new DayPilot.Scheduler("dp", {
  onBeforeResHeaderRender: (args) => {
    if (args.resource.loaded === false) {
      args.resource.html += " (loaded dynamically)";
    }
  },
  // ...
});
dp.init();

Angular

<daypilot-scheduler [config]="config"></daypilot-scheduler>

config: DayPilot.SchedulerConfig = {
  onBeforeResHeaderRender: (args) => {
    if (args.resource.loaded === false) {
      args.resource.html += " (loaded dynamically)";
    }
  },
  // ...
};

React

<DayPilotScheduler
  onBeforeResHeaderRender={onBeforeResHeaderRender}
  {/* ... */}
/>

const onBeforeResHeaderRender = (args) => {
  if (args.resource.loaded === false) {
    args.resource.html += " (loaded dynamically)";
  }
};

Vue

<DayPilotScheduler
  @beforeResHeaderRender="onBeforeResHeaderRender"
  <!-- ... -->
/>

const onBeforeResHeaderRender = (args) => {
  if (args.resource.loaded === false) {
    args.resource.html += " (loaded dynamically)";
  }
};

See Also

DayPilot.Scheduler.onBeforeRowHeaderRender

DayPilot.Scheduler.rowHeaderColumnsMode

DayPilot.Scheduler.rowHeaderColumns

DayPilot.Scheduler Class