FullCalendar – jQuery Event Calendar in ASP.NET

I was recently looking for an event calendar in ASP.NET and came across several good event jQuery/JS calendar plugins, but most of them were being implemented in PHP, not a bad language, but it wasn’t was I was needing. I was able to find a handful in ASP.NET MVC, but was not able to successfully make them work, until I came across a nicely implemented calendar event that worked right out of the box with ASP.NET.







pCloud Premium

This solution implements FullCalendar plugin [by Adam Shaw]. The calendar has the options to drag & drop, resize, create, update and delete events, really neat stuff. The only “issue” with this calendar event is that is using a VERY old version of FullCalendar, VERY old version of jQuery, a VERY old version of jQuery UI and a VERY old version of qTip.

In my quest to update this solution with the latest libraries, I came across another issue. FullCalendar was not reading the JSON being generated by the ASHX Handler, and that is when I came across a StackOverflow posting, replacing the code in the handler. [See solution by ilter]. Yet, in his code, he is updating to older libraries (which at that time were the latest).

So taking the original ASP.NET solution and the modified handler by iter, and after tinkering with the code, I was able to update everything to the latest of the greatest libraries. Took a little bit of thinking because the code was using deprecated methods that were not working with the latest FullCalendar, jQuery, and qTip codebase. Also there are some other modifications that I implemented, not found in the original ASP.NET solution. Events are fetched by an ASHX Handler.

Below you can download my fully functional solution using:

  • FullCalendar 2.0.3
  • jQuery 2.1.1
  • jQuery UI 1.11.1
  • qTip 2.2.0

Download: FullCalendar in ASP.NET
GitHub Repository: FullCalendar in ASP.NET

EventDAO class is the main class which interacts with the database and SQL Server express edition has been used. The event information is stored in a table named ‘event’ in the database.

Below is the table format:

            event
--------------------------------
event_id      |  int [identity]
description   |  VarChar(200)
title         |  VarChar(100)
event_start   |  DateTime
event_end     |  DateTime
all_day       |  Bit

Screenshots Below

Have fun.

PS. To open it just open Visual Studio then Open Website and select the solution folder…





Esau Silva
Software Engineer at Region One ESC
Microsoft Full Stack Application Developer
If you enjoyed this post, please consider leaving a comment or subscribing to the RSS feed.
Share