In the JavaScript Calendar, you can specify the business hours range using the following properties:
The business hours settings affect the following behavior:
-
The calendar control height when the heightSpec property is set to
"BusinessHours"
or"BusinessHoursNoScroll"
-
Background cell color
The background cell color can be overridden using the onBeforeCellRender event handler.
To hide the non-business hours, you can specify the displayed hour range using dayBeginsHour and dayEndsHour properties (see also overnight scheduling).
Weekends
You can show/hide weekends by selecting the ViewType:
-
"WorkWeek" (hides weekend days)
-
"Week" (shows weekends days)
CSS
-
Business cells (defined as Monday-Friday, between BusinessBeginsHour and BusinessEndsHour) are now marked with_cell_business class in CssOnly mode.
-
Styling business cells in now supported in the theme designer as well.
See also:
JavaScript
Example
onBeforeCellRender: (args) ==> {
if (args.cell.start.getDay() === 0 || args.cell.start.getDay() === 0) {
args.cell.business = true;
}
};
ASP.NET WebForms
You can define custom time cell colors using BeforeCellRender event:
protected void DayPilotCalendar1_BeforeCellRender(object sender, BeforeCellRenderEventArgs e)
{
if (e.Start.Hour >= 9 && e.Start.Hour < 12)
e.BackgroundColor = "#FFF2CC"; // shift #1
else if (e.Start.Hour >= 12 && e.Start.Hour < 15)
e.BackgroundColor = "#FFD9CC"; // shift #2
else if (e.Start.Hour >= 15 && e.Start.Hour < 18)
e.BackgroundColor = "#F2FFCC"; // shift #3
}
Turning Saturday and Sunday into business days:
protected void DayPilotCalendar1_BeforeCellRender(object sender, BeforeCellRenderEventArgs e)
{
if ((e.Start.DayOfWeek == DayOfWeek.Saturday || e.Start.DayOfWeek == DayOfWeek.Sunday)
|| (e.Start.Hour >= 9 && e.Start.Hour < 18))
{
e.IsBusiness = true;
}
}
You can also change just the IsBusiness property and you will get the color automatically:
protected void DayPilotCalendar1_BeforeCellRender(object sender, BeforeCellRenderEventArgs e)
{
if (e.Start.Hour >= 10 && e.Start.Hour < 12)
e.IsBusiness = true;
else if (e.Start.Hour >= 14 && e.Start.Hour < 16)
e.IsBusiness = true;
else
e.IsBusiness = false;
}
See Also
ASP.NET MVC
Turning Saturday and Sunday into business days:
protected override void OnBeforeCellRender(BeforeCellRenderArgs e)
{
if ((e.Start.DayOfWeek == DayOfWeek.Saturday || e.Start.DayOfWeek == DayOfWeek.Sunday)
|| (e.Start.Hour >= 9 && e.Start.Hour < 18))
{
e.IsBusiness = true;
}
}