Height

DayPilot Scheduler supports several modes for specifying the height (HeightSpec property):

• Max (default; the height will grow as in Auto mode up to the value specified in Height property; than the height will be fixed and scrollbar added)
• Auto (the height will be determined by row heights, no scrollbar is added)
• Fixed (the Height property value will be used, scrollbar is added when necessary)
• Parent100Pct (the height will be set to 100% of the parent element)
• Max100Pct (the height will grow until 100% of the parent element is reached)

JavaScript Example

<div id="dps"></div>
<script type="text/javascript">
  var dps = new DayPilot.Scheduler("dps");
  dps.heightSpec = "Max";
  dps.height = 250;
  // ...
  dps.init();
</script>

Angular

• Angular Scheduler: Full Screen Layout

ASP.NET WebForms Example

<DayPilot:DayPilotScheduler 
  runat="server" 
  id="DayPilotScheduler1"
  HeightSpec="Max"
  Height="250"
  ...
/>

ASP.NET MVC Example

@Html.DayPilotScheduler("dps", new DayPilotSchedulerConfig {
  BackendUrl = ResolveUrl("~/Scheduler/Backend"),
  Height = 300,
  HeightSpec = HeightSpec.Max,
  ...
})

Java Example (JSP)

<div id="dps"></div>
<script type="text/javascript">
  var dps = new DayPilot.Scheduler("dps");
  dps.backendUrl = "${pageContext.request.contextPath}/dps";
  dps.heightSpec = "Max";
  dps.height = 250;
  // ...
  dps.init();
</script>

HeightSpec = "Max" Display Example

1) Tree collapsed

The total height didn't reach 250 pixels. No vertical scrollbar is visible.

2) Tree expanded

The total height is bigger than 250 pixels, a vertical scrollbar is added.