DayPilot Knowledge Base

AJAX Calendar/Scheduling Controls
DayPilot Pro (AJAX Calendar Control)
» DayPilot AJAX Calendar
DayPilot Pro (AJAX Monthly Calendar Control)
» DayPilot AJAX Monthly Calendar
DayPilot Pro (AJAX Scheduler Control)
» DayPilot AJAX Scheduler
DayPilot » Knowledge Base » How to combine column visibility and cell background to show business hours in the Scheduler

How to combine column visibility and cell background to show business hours in the Scheduler

Last revision: May 23, 2011

If you decide to hide the non-business hours using ShowNonBusiness="false" you may realize that it's hiding too much.

Usually it's necessary to show several time blocks before and after the business hours and on the weekend but still indicate that it's not a standard working time.


This can be done by adjusting the column visibility and setting custom background cell colors.

1. Enlarge the visible area for working days

Define lower BusinessBeginsHour value (5 instead of 7) and higher BusinessEndsHour (18 instead of 15).

This will show a bigger time frame each working day.

2. Show the weekends

Override BeforeTimeHeaderRender and set the column visibility for weekend time cells.

protected void DayPilotScheduler1_BeforeTimeHeaderRender(object sender, DayPilot.Web.Ui.Events.BeforeTimeHeaderRenderEventArgs e)
  if (e.Start.DayOfWeek == DayOfWeek.Saturday || e.Start.DayOfWeek == DayOfWeek.Sunday) {
    if (e.Start.Hour > DayPilotScheduler1.BusinessBeginsHour && e.Start.Hour < DayPilotScheduler1.BusinessEndsHour - 1) {
      e.Visible = true;

3. Indicate the real business hours using cell background color

protected void DayPilotScheduler1_BeforeCellRender(object sender, DayPilot.Web.Ui.Events.BeforeCellRenderEventArgs e)
if (e.Start.Hour < 7) {
e.IsBusiness = false;
  if (e.End.Hour > 15) {
e.IsBusiness = false;


How to show business hours on weekends in Scheduler
How to define Calendar business and non-business days
How To Set Up Overnight Shift Scheduling with DayPilot Calendar
List of CSS classes used in CssOnly mode (Calendar)