Skip to main content

FullCalendar

Namespace: Wisej.Web.Ext.FullCalendar

Assembly: Wisej.Web.Ext.FullCalendar (4.1.0.0)

FullCalendar is a drag-n-drop widget for displaying events on a full-sized calendar based on the open-source fullcalendar.io. See http://fullcalendar.io/.

public class FullCalendar : Widget, IWisejDataStore

The FullCalendar JavaScript component is developed by Adam Shaw and released under the MIT license: http://fullcalendar.io/license/.

The control uses FullCalendar 3.9.0 (and the optional scheduler plug-in 1.9.4, see SchedulerLicenseKey). The calendar doesn't show its own header toolbar: navigate using Previous, Next, Today, GotoDate or CurrentDate and switch views using View.

The events are loaded on demand: every time the visible date range changes, the client requests the events in that range from the Events collection or, when VirtualMode is true, through the VirtualEventsNeeded event. Changing most of the properties recreates the calendar on the client.

Example:

Creating a calendar in week view with a couple of events:

var calendar = new FullCalendar();
calendar.Dock = DockStyle.Fill;
calendar.View = ViewType.AgendaWeek;
calendar.Events.Add(new Event(DateTime.Today.AddHours(9), TimeSpan.FromHours(1)) { Title = "Stand-up" });
calendar.Events.Add(DateTime.Today.AddDays(1)).Title = "Company holiday";
calendar.EventClick += (s, e) => AlertBox.Show(e.Event.Title);
this.Controls.Add(calendar);

Constructors​

Instance member FullCalendar()​

Constructs a new instance of the FullCalendar control.

Properties​

Instance member AllDaySlot​

Boolean: Returns or sets whether the "all-day" slot is displayed at the top of the agenda views. (Default: True)

The default is true. The title of the slot is set by AllDayText.

Instance member AllDayText​

String: Returns or sets the text titling the "all-day" slot at the top of the calendar.

The default is "All Day". Setting it to an empty string restores the default. Setting the property recreates the calendar on the client.

Instance member BusinessHours​

BusinessHours[]: Returns or sets the business hours to emphasize on the calendar. (Default: null)

The default is null: no business hours are emphasized. Each BusinessHours item defines a time range (9 AM to 5 PM by default) for a set of days, which allows different hours on different days. Assign a new array to apply changes: modifying the items of the current array doesn't update the calendar. Setting the property recreates the calendar on the client.

Example:

Emphasizing Monday to Friday 8 AM - 6 PM and Saturday 9 AM - 1 PM:

this.fullCalendar1.BusinessHours = new[] {
new BusinessHours {
Start = new TimeSpan(8, 0, 0),
End = new TimeSpan(18, 0, 0),
Days = new[] { DayOfWeek.Monday, DayOfWeek.Tuesday, DayOfWeek.Wednesday, DayOfWeek.Thursday, DayOfWeek.Friday }
},
new BusinessHours {
Start = new TimeSpan(9, 0, 0),
End = new TimeSpan(13, 0, 0),
Days = new[] { DayOfWeek.Saturday }
}
};

Instance member CurrentDate​

DateTime: Returns or sets the current value that is used by the FullCalendar to display the current view.

Value: A DateTime representing the currently displayed date/time. The default is the current system time.

Setting the property keeps only the date part of the value, moves the calendar to the new date (see GotoDate) and fires the CurrentDateChanged event.

The property is also updated, firing CurrentDateChanged, when the client reports that the displayed date changed after a call to Previous, Next, PreviousYear, NextYear, Today or GotoDate. That happens asynchronously, so the value is not updated yet when those methods return.

Example:

Moving the calendar to October 2026:

this.fullCalendar1.CurrentDate = new DateTime(2026, 10, 1);

Showing the displayed month in a label:

private void fullCalendar1_CurrentDateChanged(object sender, EventArgs e)
{
this.labelMonth.Text = this.fullCalendar1.CurrentDate.ToString("MMMM yyyy");
}

Protected member DefaultAllDayText​

String: Returns the default The text titling the "all-day" slot at the top of the calendar.

Protected member DefaultNoEventsMessage​

String: Returns the default message to display in one if the list views when there are no events.

Instance member Editable​

Boolean: Returns or sets whether the events on the calendar can be dragged and resized by the user. (Default: True)

The default is true. Individual events can override the value using Editable.

Instance member EventBackgroundColor​

Color: Returns or sets the background color for all events in the calendar. (Default: Color [Empty])

Individual events can override the value using BackgroundColor.

Instance member EventBorderColor​

Color: Returns or sets the border color for all events in the calendar. (Default: Color [Empty])

Individual events can override the value using BorderColor.

Instance member EventLimit​

Int32: Returns or sets the maximum number of events displayed on a day. (Default: 0)

The default is 0, which means that the number of events is not limited. When there are too many events, a link that looks like "+2 more" is displayed; clicking the link shows the hidden events in a popover. Setting the property recreates the calendar on the client.

Throws:

Example:

Showing at most 3 events per day in the month view:

this.fullCalendar1.View = ViewType.Month;
this.fullCalendar1.EventLimit = 3;

Instance member Events​

EventCollection: Returns the collection of Event managed by this FullCalendar control.

Adding, removing or changing events reloads the events of the visible range on the client after the current request. Events without an ID receive an automatic ID when added; adding an event with the ID of an existing event replaces it. When VirtualMode is true the collection can't be modified and retrieving events fires RetrieveVirtualEvent.

Example:

Adding and finding events:

this.fullCalendar1.Events.Add("meeting1", new DateTime(2026, 10, 5, 10, 0, 0), TimeSpan.FromMinutes(90)).Title = "Design review";
this.fullCalendar1.Events.Add(new Event("vacation", new DateTime(2026, 10, 12)) { Title = "Vacation", BackgroundColor = Color.SeaGreen });

var ev = this.fullCalendar1.Events["meeting1"];
if (ev != null)
ev.Start = ev.Start.AddHours(1);

Instance member EventTextColor​

Color: Returns or sets the text color for all events in the calendar. (Default: Color [Empty])

Individual events can override the value using TextColor.

Instance member FirstDayOfWeek​

Day: Returns or sets the first day of the week as displayed in the FullCalendar. (Default: Default)

Value: One of the Day values. The default is Default.

Setting the property recreates the calendar on the client.

Instance member HeaderFormats​

ColumnHeaderFormats: Returns the formats of the column headers in the different views using momentjs format patterns: http://momentjs.com/docs/#/displaying/format/.

Each format that is not set returns "Default" and uses the format of the current locale. Changing any of the formats recreates the calendar on the client.

Example:

Customizing the column headers of the day, week and month views:

this.fullCalendar1.HeaderFormats.DayViewFormat = "dddd, MMMM D";
this.fullCalendar1.HeaderFormats.WeekViewFormat = "ddd D/M";
this.fullCalendar1.HeaderFormats.MonthViewFormat = "dddd";

Instance member InitScript​

String: Returns the initialization script that creates the FullCalendar instance on the client.

The script is built from the embedded startup.js resource and the current values of the properties of the control; the setter is ignored.

Instance member MaxTime​

TimeSpan: Returns or sets the last time slot (exclusive) that will be displayed for each day, even when the scrollbars have been scrolled all the way down.

Applies to the views with time slots (agenda and timeline views). The default is 24 hours (the end of the day). Setting the property recreates the calendar on the client.

Example:

Ending the day view at 6 PM:

this.fullCalendar1.MaxTime = new TimeSpan(18, 0, 0);

Instance member MinTime​

TimeSpan: Returns or sets the first time slot that will be displayed for each day, even when the scrollbars have been scrolled all the way up.

Applies to the views with time slots (agenda and timeline views). The value is a time of the day; the default is 00:00:00. Setting the property recreates the calendar on the client.

Example:

Limiting the agenda views to working hours:

this.fullCalendar1.MinTime = new TimeSpan(7, 0, 0);
this.fullCalendar1.MaxTime = new TimeSpan(19, 0, 0);
this.fullCalendar1.ScrollTime = new TimeSpan(8, 0, 0);

Instance member NextDayThreshold​

TimeSpan: Returns or sets the next-day threshold time.

When an event's end time spans into another day, this is the minimum time it must be in order for it to render as if it were on that day. The default is 09:00:00.

Only affects timed events that appear on whole-days. Whole-day cells occur in the Month, BasicDay and BasicWeek views and in the all-day slots of the agenda views.

Example:

Rendering an event that ends at 2 AM only on its first day:

this.fullCalendar1.NextDayThreshold = new TimeSpan(3, 0, 0);
this.fullCalendar1.Events.Add(new DateTime(2026, 10, 3, 20, 0, 0), new DateTime(2026, 10, 4, 2, 0, 0)).Title = "Party";

Instance member NoEventsMessage​

String: Returns or sets the message to display in one of the list views when there are no events to display.

The default is "No events to display". Setting it to an empty string restores the default. Setting the property recreates the calendar on the client.

Instance member Options​

Object: Overridden, not used. Always returns null and the setter is ignored.

The FullCalendar options are generated from the properties of the control.

Instance member Packages​

List<Package>: Returns the list of packages loaded by the client before the widget is initialized.

The list contains jQuery 3.1.1, moment.js 2.17.1 and FullCalendar 3.9.0 and, when SchedulerLicenseKey is not empty, the scheduler plug-in 1.9.4. The packages are served from the resources embedded in this assembly and the list is built only the first time the property is read.

Instance member ResourceAreaWidth​

String: Returns or sets the width of the area that contains the list of resources. Requires the SchedulerLicenseKey to be set to a valid license or to a GPL or CC license. (Default: "30%")

The value is a CSS width, either a percentage of the calendar width or a size in pixels. The default is "30%". Setting the property recreates the calendar on the client.

Example:

Using a fixed width for the resource area:

this.fullCalendar1.ResourceAreaWidth = "200px";

Instance member ResourceLabelText​

String: Returns or sets the text that will appear above the list of resources. Requires the SchedulerLicenseKey to be set to a valid license or to a GPL or CC license. (Default: "Resources")

The default is "Resources". Setting the property recreates the calendar on the client.

Instance member Resources​

SchedulerResource[]: Returns or sets the scheduler resources. Requires the SchedulerLicenseKey to be set to a valid license or to a GPL or CC license. (Default: null)

Events are associated to a resource using ResourceId. The resources are displayed in the timeline views. Assign a new array to add or remove resources; changing the properties of a resource fires ResourceChanged but doesn't redraw the calendar. Setting the property recreates the calendar on the client.

Example:

Assigning events to resources:

this.fullCalendar1.SchedulerLicenseKey = "GPL-My-Project-Is-Open-Source";
this.fullCalendar1.Resources = new[] {
new SchedulerResource("a") { Title = "Auditorium A", EventBackgroundColor = Color.SteelBlue },
new SchedulerResource("b") { Title = "Auditorium B", EventBackgroundColor = Color.IndianRed }
};
this.fullCalendar1.View = ViewType.TimelineDay;
this.fullCalendar1.Events.Add(DateTime.Today.AddHours(10), TimeSpan.FromHours(2)).ResourceId = "a";

Instance member SchedulerLicenseKey​

String: Returns or sets the license key for the scheduler plug-in. See scheduler. (Default: "")

Use "GPL-My-Project-Is-Open-Source" for GPL projects, or "CC-Attribution-NonCommercial-NoDerivatives" for non commercial projects.

When the key is not empty, the scheduler scripts are added to Packages and the Resources, ResourceLabelText and ResourceAreaWidth properties are sent to the client. The packages are built only once, the first time they are requested, so set the key in the designer or before the control is created. The key is also required before setting View to a timeline view.

Example:

Enabling the scheduler plug-in and showing the resources in a timeline view:

this.fullCalendar1.SchedulerLicenseKey = "GPL-My-Project-Is-Open-Source";
this.fullCalendar1.Resources = new[] {
new SchedulerResource("room1") { Title = "Room 1" },
new SchedulerResource("room2") { Title = "Room 2" }
};
this.fullCalendar1.View = ViewType.TimelineDay;

Instance member ScrollTime​

TimeSpan: Returns or sets the time the time-slot views are initially scrolled to.

The default is 06:00:00. Setting the property recreates the calendar on the client. When the calendar becomes visible after having been hidden, the scroll position is computed assuming 30 minutes slots (the default SlotDuration).

Example:

Scrolling to 8 AM when the agenda view is displayed:

this.fullCalendar1.ScrollTime = new TimeSpan(8, 0, 0);

Instance member ShowCurrentTime​

Boolean: Returns or sets whether to display a marker indicating the current time. (Default: True)

The default is true. The marker is displayed in the views with time slots at the time of TodayDate.

Instance member ShowEventToolTips​

Boolean: Returns or sets whether ToolTips are shown when the mouse pointer hovers over a Event. Since 3.5.13 (Default: False)

Value: true if ToolTips are shown when the mouse pointer hovers over a Event; otherwise, false. The default is false.

The ToolTip shows ToolTipText or, when it's not set, Title.

Instance member SlotDuration​

TimeSpan: Returns or sets the duration of the time slots.

The default is 30 minutes. Labels are displayed according to SlotLabelInterval. Setting the property recreates the calendar on the client.

Example:

Using 15 minutes slots:

this.fullCalendar1.SlotDuration = TimeSpan.FromMinutes(15);

Instance member SlotEventOverlap​

Boolean: Returns or sets whether timed events in the agenda views should visually overlap. (Default: True)

The default is true. When false, events that overlap in time are displayed side by side.

Instance member SlotLabelFormat​

String: Returns or sets the time-text that will be displayed on the vertical axis of the agenda views using momentjs format patterns: http://momentjs.com/docs/#/displaying/format/.

Returns "Default" when not set, in which case the format of the current locale is used. Setting it to null or an empty string restores the default. Setting the property recreates the calendar on the client.

Example:

Showing the axis labels in 24 hours format:

this.fullCalendar1.SlotLabelFormat = "HH:mm";

Instance member SlotLabelInterval​

TimeSpan: Returns or sets how often the time-axis is labeled with text displaying the date/time of the slots.

The default is 1 hour. The value is always sent to the client, so it's not computed automatically from SlotDuration: when changing SlotDuration adjust this property as well. Setting the property recreates the calendar on the client.

Example:

Using 15 minutes slots labeled every 30 minutes:

this.fullCalendar1.SlotDuration = TimeSpan.FromMinutes(15);
this.fullCalendar1.SlotLabelInterval = TimeSpan.FromMinutes(30);

Instance member ThemeSystem​

ThemeSystem: Returns or sets the theme system used by the calendar. (Default: Standard)

The ThemeSystem property can be one of these values:

  • Standard Renders the built-in look & feel.
  • Bootstrap3 Supports Bootstrap 3 themes. The Bootstrap CSS file must be loaded separately in its own link tag.
  • jQueryUI Supports jQuery UI themes. The jQuery UI CSS file must be loaded separately in its own link tag.

Once the control is created, changing the value updates the option on the client without recreating the calendar.

Instance member TimeFormat​

String: Returns or sets the time-text that will be displayed on each event using momentjs format patterns: http://momentjs.com/docs/#/displaying/format/. (Default: null)

The default is null, in which case the format of the current locale is used. Setting the property recreates the calendar on the client.

Example:

Setting the time format to display on the events:

this.fullCalendar1.TimeFormat = "h:mm"; // shows 5:00
this.fullCalendar1.TimeFormat = "h(:mm)t"; // shows 5p
this.fullCalendar1.TimeFormat = "HH:mm"; // shows 17:00

Instance member TodayDate​

DateTime: Returns or sets the value that is used by FullCalendar as today's date.

Value: A DateTime representing today's date. The default value is the current system date.

The value is used to highlight the current day, to place the current time marker (see ShowCurrentTime) and as the target of Today. Until it's set, the property returns Now evaluated on the server every time it's read. Setting the property recreates the calendar on the client.

Example:

Using the time zone of the user instead of the server's time:

var zone = TimeZoneInfo.FindSystemTimeZoneById("W. Europe Standard Time");
this.fullCalendar1.TodayDate = TimeZoneInfo.ConvertTimeFromUtc(DateTime.UtcNow, zone);

Instance member View​

ViewType: Returns or sets the view the calendar uses to display the events. (Default: Month)

The default is Month. Once the control is created, changing the view switches the view on the client without recreating the calendar. The timeline views are part of the scheduler plug-in and require SchedulerLicenseKey to be set first.

Throws:

Example:

Switching between views using buttons:

private void buttonWeek_Click(object sender, EventArgs e)
{
this.fullCalendar1.View = ViewType.AgendaWeek;
}

private void buttonList_Click(object sender, EventArgs e)
{
this.fullCalendar1.View = ViewType.ListMonth;
}

Instance member VirtualSize​

Int32: Returns or sets the number of Event objects contained in the list when in virtual mode. (Default: 0)

Value: The number of Event objects contained in the FullCalendar when in virtual mode.

The value is returned by Count when VirtualMode is true and limits the indexes that can be used with the Events indexer. Changing the value in virtual mode reloads the events on the client.

Throws:

Example:

Setting the number of virtual events after loading the data:

this.fullCalendar1.VirtualMode = true;
this.fullCalendar1.VirtualSize = this.appointments.Count;

Methods​

Instance member GotoDate(dateTime)​

Moves the calendar to an arbitrary date.

ParameterTypeDescription
dateTimeDateTimeThe date to set the calendar view to.

The view is not changed: it displays the month, week or day that contains dateTime . CurrentDate is updated and CurrentDateChanged is fired asynchronously, when the client reports the new date. If the calendar is not created on the client yet, the call is executed when it's ready.

Example:

Moving the calendar to the date selected in a DateTimePicker:

private void dateTimePicker1_ValueChanged(object sender, EventArgs e)
{
this.fullCalendar1.GotoDate(this.dateTimePicker1.Value);
}

Instance member Next()​

Moves the calendar one step forward (either by a month, week, or day).

The step depends on the current View: the month views move forward one month, the week views one week and the day views one day. CurrentDate is updated and CurrentDateChanged is fired asynchronously, when the client reports the new date.

Example:

Implementing a custom navigation toolbar:

private void buttonNext_Click(object sender, EventArgs e)
{
this.fullCalendar1.Next();
}

Instance member NextYear()​

Moves the calendar forward one year.

CurrentDate is updated and CurrentDateChanged is fired asynchronously, when the client reports the new date.

Example:

Going forward one year:

private void buttonNextYear_Click(object sender, EventArgs e)
{
this.fullCalendar1.NextYear();
}

Protected member OnCurrentDateChanged(e)​

Fires the CurrentDateChanged event.

ParameterTypeDescription
eEventArgsA EventArgs instance that contains the event data.

Protected member OnDayClick(e)​

Fires the DayClick event.

ParameterTypeDescription
eDayClickEventArgs

Protected member OnDayDoubleClick(e)​

Fires the DayDoubleClick event.

ParameterTypeDescription
eDayClickEventArgs

Protected member OnEventChanged(e)​

Fires the EventChanged event.

ParameterTypeDescription
eEventValueEventArgsA EventValueEventArgs that contains the event data.

Protected member OnEventClick(e)​

Fires the DayClick event.

ParameterTypeDescription
eEventClickEventArgs

Protected member OnEventDoubleClick(e)​

Fires the EventDoubleClick event.

ParameterTypeDescription
eEventClickEventArgs

Protected member OnEventMouseEnter(e)​

Raises the EventMouseEnter event.

ParameterTypeDescription
eEventMouseEnterArgsThe event data associated with the mouse enter event.

This method is called to invoke the EventMouseEnter event handlers. Derived classes can override this method to provide custom handling for the event. When overriding, ensure to call the base implementation to maintain event invocation.

Protected member OnEventMouseLeave(e)​

Raises the EventMouseLeave event.

ParameterTypeDescription
eEventMouseLeaveArgsThe event data associated with the mouse enter event.

This method is called to invoke the EventMouseLeave event handlers. Derived classes can override this method to provide custom handling for the event. When overriding, ensure to call the base implementation to maintain event invocation.

Protected member OnItemDrop(e)​

Fires the ItemDrop event.

ParameterTypeDescription
eItemDropEventArgs

Protected member OnResourceChanged(e)​

Fires the ResourceChanged event.

ParameterTypeDescription
eResourceEventArgsA ResourceEventArgs that contains the event data.

Protected member OnRetrieveVirtualEvent(e)​

Fires the RetrieveVirtualEvent event.

ParameterTypeDescription
eRetrieveVirtualEventEventArgsA RetrieveVirtualEventEventArgs that contains the event data.

Protected member OnVirtualEventsNeeded(e)​

Fires the VirtualEventsNeeded event.

ParameterTypeDescription
eVirtualEventsNeededEventArgsA EventsNeededEventArgs that contains the event data.

Protected member OnWidgetEvent(e)​

Handles events fired by the widget.

ParameterTypeDescription
eWidgetEventArgs

Instance member Previous()​

Moves the calendar one step back (either by a month, week, or day).

The step depends on the current View: the month views move back one month, the week views one week and the day views one day. CurrentDate is updated and CurrentDateChanged is fired asynchronously, when the client reports the new date.

Example:

Implementing a custom navigation toolbar:

private void buttonPrev_Click(object sender, EventArgs e)
{
this.fullCalendar1.Previous();
}

Instance member PreviousYear()​

Moves the calendar back one year.

CurrentDate is updated and CurrentDateChanged is fired asynchronously, when the client reports the new date.

Example:

Going back one year:

private void buttonPrevYear_Click(object sender, EventArgs e)
{
this.fullCalendar1.PreviousYear();
}

Instance member Today()​

Moves the calendar to the current date.

The current date is the value of TodayDate. CurrentDate is updated and CurrentDateChanged is fired asynchronously, when the client reports the new date.

Example:

Going back to today:

private void buttonToday_Click(object sender, EventArgs e)
{
this.fullCalendar1.Today();
}

Events​

Instance member CurrentDateChanged​

EventHandler Triggered when the current date used to display the calendar view is changed.

Instance member DayClick​

DayClickEventHandler Triggered when the user clicks a day in the calendar.

Instance member DayDoubleClick​

DayClickEventHandler Triggered when the user double clicks a day in the calendar.

Instance member EventChanged​

EventValueEventHandler Triggered when the user changed (dragged or resized) an Event object.

Instance member EventClick​

EventClickEventHandler Triggered when the user clicks an event.

Instance member EventDoubleClick​

EventClickEventHandler Triggered when the user double clicks an event.

Instance member EventMouseEnter​

EventMouseEnterHandler Triggered when the mouse enters the event control.

Instance member EventMouseLeave​

EventMouseLeaveHandler Triggered when the mouse leaves the event control.

Instance member ItemDrop​

ItemDropEventHandler Triggered when the user drops an object on the calendar.

Instance member ResourceChanged​

ResourceEventHandler Triggered when the a SchedulerResource object changes.

Instance member RetrieveVirtualEvent​

RetrieveVirtualEventEventHandler Triggered when VirtualMode is true and the control needs to retrieve a specific virtual event instance.

Instance member VirtualEventsNeeded​

VirtualEventsNeededEventHandler Triggered when VirtualMode is true and the control needs to populate the events on a certain date, week or month.

The application should manage and cache the events that are returned in response to this event.

Implements​