ASP.NET MVC Scheduler

Demo Download

DayPilot Scheduler is a time line with multiple resources on the vertical axis.

See Also


Scheduler Features

Scheduler Timeline

The X axis of the scheduler displays a timeline.

  • The time cell duration is customizable (in minutes).
  • The total timeline length is customizable (in days).
  • The time headers can display several levels (grouped by hour, day, week, month, year).
  • Selected time columns can be hidden (non-business hours, weekends).

More about time header.


The scheduler displays custom resources on the Y axis.

  • The resources can be arranged in a tree hierarchy. 
  • Resource tree children can be loaded dynamically for improved performance.
  • Each resource can display custom columns with additional parameters.

More about rows/resources.

Events and Drag and Drop

The scheduler supports event drag and drop operations:

  • event creating
  • event moving
  • event resizing

Events can be customized easily (CSS class, background color, HTML, active areas). You can disabled selected actions (clicking, moving, context menu...) for individual events to make them read-only.

More about events.

jQuery Scheduler

You can use the built-in jQuery plugin to initialize the control instead of the Html helper. jQuery is not required.

<div id="dps_jquery"></div> 

<script type="text/javascript"> 
var dps = $("#dps_jquery").daypilotScheduler({ 
  backendUrl: '<%= ResolveUrl("~/Scheduler/Backend") %>', 
  height: 300, 
  heightSpec: "Max", 
  timeRangeSelectedHandling: "CallBack", 
  cssClassPrefix: "scheduler_green", 
  eventHeight: 25,
  days: 7

More about scheduler jQuery plugin.

Integrated UI Controls

Integrated message bar for showing custom messages.
Context menuBubble (extended tooltip) for quick showing event details.
Active areas with user actions hints.

Read more about integrated scheduler controls.

Full CSS Support

The scheduler can be fully styled using CSS.

Read more about scheduler CSS.

CSS Themes

The scheduler comes with 5 standard CSS themes (scheduler_white, scheduler_8, scheduler_green, scheduler_transparent, scheduler_blue). You can create your own theme using the online theme designer.

White CSS Theme

Windows 8 CSS Theme

Transparent CSS Theme

Green CSS Theme

Blue CSS Theme

Mobile and Touch Devices Support

The scheduler supports mobile devices (tablets, smartphones) with iOS and Android.

Read more about mobile and touch devices support.

Scheduler Customizations

All scheduler elements can be customized (resources, events, background cells, time headers).

You can set custom CSS classes, HTML, action restrictions, active areas.


The scheduler control will be translated and localized automatically using the current culture. The following properties are adjusted automatically:

  • time format
  • date format
  • clock (12/24 hours)
  • first day of week
  • day names
  • month names

Read more about localization.


Server-Side API Reference

Client-Side API Reference

Quick Start

MVC View


@using DayPilot.Web.Mvc;
@using DayPilot.Web.Mvc.Events.Scheduler;
@using DayPilot.Web.Mvc.Enums.Scheduler;
<!DOCTYPE html>
    <!-- ... -->
    <title>Scheduler for ASP.NET MVC</title>
    <script src="@Url.Content("~/Scripts/DayPilot/daypilot-all.min.js")" type="text/javascript"></script>
    <link href="@Url.Content("~/Themes/scheduler_white.css")" rel="stylesheet" type="text/css" />

@Html.DayPilotScheduler("dps", new DayPilotSchedulerConfig
  BackendUrl = Url.Content("~/Scheduler/Backend"),
  EventResizeHandling = EventResizeHandlingType.CallBack,
  EventMoveHandling = EventMoveHandlingType.CallBack,
  CellGroupBy = GroupBy.Month,
  CellDuration = 1440,
  Days = 365,
  StartDate = new DateTime(DateTime.Today.Year, 1, 1),
	CssOnly = true,
	CssClassPrefix = "scheduler_white",
	EventHeight = 25


MVC Controller


using System;
using System.Collections.Generic;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using DayPilot.Web.Mvc;
using DayPilot.Web.Mvc.Enums;
using DayPilot.Web.Mvc.Events.Scheduler;

public class SchedulerController : Controller
  // GET: /Scheduler/
  public ActionResult Index()
      return View();
  // POST: /Scheduler/Backend
  public ActionResult Backend()
      return new Dps().CallBack(this);

  class Dps : DayPilotScheduler
      protected override void OnInit(InitArgs e)
          UpdateWithMessage("Welcome!", CallBackUpdateType.Full);

      private void LoadResources()
          foreach (DataRow r in new EventManager().GetResources().Rows)
              Resources.Add((string) r["name"], Convert.ToString(r["id"]));

      protected override void OnEventResize(EventResizeArgs e)
          new EventManager().EventMove(e.Id, e.NewStart, e.NewEnd, e.Resource);
          UpdateWithMessage("The event was resized.");

      protected override void OnEventMove(EventMoveArgs e)
          new EventManager().EventMove(e.Id, e.NewStart, e.NewEnd, e.NewResource);
          UpdateWithMessage("The event was moved.");

      protected override void OnFinish()
          if (UpdateType == CallBackUpdateType.None)

          Events = new EventManager().FilteredData(StartDate, StartDate.AddDays(Days)).AsEnumerable();

          DataIdField = "id";
          DataTextField = "name";
          DataStartField = "eventstart";
          DataEndField = "eventend";
          DataResourceField = "resource";