DayPilot.Scheduler.onDimensionsChanged

The onDimensionsChanged event handler fires when the Scheduler dimensions change, for example when the width or height is set in percentages and the browser window is resized.

Declaration

DayPilot.Scheduler.onDimensionsChanged(args)

Parameters

• args.oldHeight (number) - previous Scheduler height

• args.newHeight (number) - new Scheduler height

• args.oldWidth (number) - previous Scheduler width

• args.newWidth (number) - new Scheduler width

• args.oldRowHeaderWidth (number) - previous row header width

• args.newRowHeaderWidth (number) - new row header width

Examples

JavaScript

const onDimensionsChanged = (args) => {
  console.log("Scheduler size:", args.newWidth, args.newHeight);
};

const dp = new DayPilot.Scheduler("dp", {
  onDimensionsChanged: onDimensionsChanged,
  // ...
});
dp.init();

Angular

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

const onDimensionsChanged = (args: DayPilot.SchedulerDimensionsChangedArgs) => {
  console.log("Scheduler size:", args.newWidth, args.newHeight);
};

config: DayPilot.SchedulerConfig = {
  onDimensionsChanged: onDimensionsChanged,
  // ...
};

React

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

const onDimensionsChanged = (args) => {
  console.log("Scheduler size:", args.newWidth, args.newHeight);
};

Vue

<DayPilotScheduler
  @dimensionsChanged="onDimensionsChanged"
  <!-- ... -->
/>

const onDimensionsChanged = (args) => {
  console.log("Scheduler size:", args.newWidth, args.newHeight);
};

See Also

DayPilot.Scheduler Class