AJAX Scheduler for ASP.NET MVC Tutorial (Updated)

Sample Visual Studio project that shows how to use DayPilot AJAX Scheduler in ASP.NET MVC. With C# and VB.NET source code and sample SQL Server database.
Aug 12, 2013
scheduler mvc new event modal popup

AJAX Scheduler for ASP.NET MVC 4 Razor Tutorial

The ASP.NET MVC Scheduler Tutorial has been updated. It includes several improvements.

1. New event dialog

Selecting a time range using drag and drop invokes a modal dialog for entering event details.

C#

@Html.DayPilotScheduler("dps", new DayPilotSchedulerConfig
{
    BackendUrl = Url.Content("~/Scheduler/Backend"),
    TimeRangeSelectedHandling = TimeRangeSelectedHandlingType.JavaScript,
    TimeRangeSelectedJavaScript = "modal('Event/Create?start=' + start + '&end=' + end + '&resource=' + resource)"    
})

VB.NET

@Html.DayPilotCalendar("dps", new DayPilotSchedulerConfig With
{
    .BackendUrl = Url.Content("~/Scheduler/Backend"),
    .TimeRangeSelectedHandling = TimeRangeSelectedHandlingType.JavaScript,
    .TimeRangeSelectedJavaScript = "modal('Event/Create?start=' + start + '&end=' + end + '&resource=' + resource)"
})

2. Dialog for event editing

Clicking an event opens an event edit dialog. Similar to the dialog for entering new events: it lets the user change he even text, start and end dates, and resource.

C#

@Html.DayPilotScheduler("dps", new DayPilotSchedulerConfig
{
  EventClickHandling = EventClickHandlingType.JavaScript,
  EventClickJavaScript = "modal('Event/Edit/' + e.id())",
  ...
})

VB.NET

@Html.DayPilotScheduler("dps", New DayPilotSchedulerConfig With
{
  .EventClickHandling = EventClickHandlingType.JavaScript,
  .EventClickJavaScript = "modal('Event/Edit/' + e.id())",
  ...
})

The modal() function opens a new modal dialog using DayPilot.Modal JavaScript class:

<script type="text/javascript">
    function modal(url) {
        var m = new DayPilot.Modal();
        m.closed = function () {
            if (this.result == "OK") {
                dps.commandCallBack('refresh');
            }
            dps.clearSelection();
        };
        m.showUrl(url);
    }
</script>

3. Loading resources from a database

The resources are loaded from SQL Server database ([resource] table).

C#

protected override void OnInit(InitArgs e)
{
  LoadResources();

  UpdateWithMessage("Welcome!", CallBackUpdateType.Full);
}

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

VB.NET

Protected Overrides Sub OnInit(ByVal e As InitArgs)
  LoadResources()

  UpdateWithMessage("Welcome!", CallBackUpdateType.Full)
End Sub

Private Sub LoadResources()
  For Each r As DataRow In (New EventManager()).GetResources().Rows
    Resources.Add(CStr(r("name")), Convert.ToString(r("id")))
  Next r
End Sub

Tutorial and Project Download

The tutorial includes Visual Studio 2010 solution that includes sample C# and VB projects.

DayPilot for JavaScript, ASP.NET WebForms, ASP.NET MVC, Java