In MindFusion.Scheduling for ASP.NET interactive creating, modifying and deleting of items in a calendar view is facilitated by using the built-it popup Forms - namely NewForm - for quickly creating items, EditForm - for detailed creation of items or editing, RecurrenceForm - for specifying / editing / removing a recurrence pattern for an item, ItemsCueForm - a container form, used for displaying items, which are not visible in a time cell. To disable the forms set the Calendar.UseForms property to false. You can style the default forms and customize them to your liking. More information on the CSS classes used to style forms in different Themes can be found in the CSS Classes topic.
All of the included forms derive from the BaseForm class, and share some similar functionality. When a form is about to be opened in a Calendar, the FormShow event is raised, where the FormEventArgs argument, contains information about the opening form - its type, its header text, the item it's associated with and so on. By handling the FormShow event, you can choose to not show a particular form, or to show a modified or completely different version of it.
The following example shows how you can modify an opening form by handling the FormShow event.
ASPX
![]() |
---|
<MindFusion:Calendar ID="Calendar1" runat="server" FormShowScript="onFormShow" /> |
JavaScript
![]() |
---|
<script type="text/javascript"> |
Through the BaseForm.getControls method you can obtain references to the HTML elements, used in a particular form.
For example, you may wish to forbid interactive recurrence pattern creation through forms. In order to do that, you can hide the Recurrence button, used to show the RecurrenceForm in the EditForm:
JavaScript
![]() |
---|
function onFormShow(sender, args) { |
The following tables show a complete list of the ids and types of the HTML elements, used in the built-in forms.
Id of the element | Element type | Description |
---|---|---|
headerElement | div | The header of the form. |
headerClose | a | The header close button in the upper right corner of the form. |
subject | textarea | The subject text area of the form. |
btnSave | a | The Save button. |
btnOptions | a | The Options button. |
Id of the element | Element type | Description |
---|---|---|
InfoDiv | div | Div showing information about recurrence patterns. |
TimeDiv | div | The area containing start and end time related elements. |
allDayEvent | checkbox | The 'All day event' checkbox. |
btnCancel | a | The Cancel button. |
btnRecurrence | a | The Recurrence button. |
btnSave | a | The Save button. |
contacts | div | The Contacts area. |
details | textarea | The Details area. |
endDate | div | The end time date component. |
endTime | div | The end time time component. |
headerClose | a | The header close button in the upper right corner of the form. |
headerElement | div | The header of the form. |
location | select | The Location drop-down. |
reminder | select | The Reminder drop-down. |
reminderCheck | checkbox | The Reminder checkbox. |
startDate | div | The start time date component. |
startTime | div | The start time time component. |
subject | text | The Subject area. |
Id of the element | Element type | Description |
---|---|---|
DayDiv | div | The daily recurrence pattern area. |
IntervalDiv | div | The time interval recurrence pattern area. |
MonthDiv | div | The monthly recurrence pattern area. |
WeekDiv | div | The weekly recurrence pattern area. |
YearDiv | div | The yearly recurrence pattern area. |
btnCancel | a | The Cancel button. |
btnSave | a | The Save button. |
btnDelete | a | The Delete button. |
daily | radio | The 'Daily' pattern selection radio button |
weekly | radio | The 'Weekly' pattern selection radio button |
monthly | radio | The 'Monthly' pattern selection radio button |
yearly | radio | The 'Yearly' pattern selection radio button |
interval | radio | The 'By time interval' pattern selection radio button |
startDate | div | The start date element. |
noEnd | radio | The RecurrenceEnd.Never radio button. |
endAfter | radio | The End after radio button. |
numOccurences | div | The number of occurrences up/down. |
endDate | div | The end date element. |
endBy | radio | The End by radio button. |
dailyEvery | radio | The every day radio button. (Daily pattern) |
dailyEveryDay | div | The every day up/down. (Daily pattern) |
dailyWeekDay | radio | The weekday radio button. (Daily pattern) |
dailyWeekendDay | radio | The weekend radio button. (Daily pattern) |
weekEvery | div | The every week up/down. (Weekly pattern) |
dayOfWeek0 | checkbox | The first day of week. (Weekly pattern) |
dayOfWeek1 | checkbox | The second day of week. (Weekly pattern) |
dayOfWeek2 | checkbox | The third day of week. (Weekly pattern) |
dayOfWeek3 | checkbox | The fourth day of week. (Weekly pattern) |
dayOfWeek4 | checkbox | The fifth day of week. (Weekly pattern) |
dayOfWeek5 | checkbox | The sixth day of week. (Weekly pattern) |
dayOfWeek6 | checkbox | The seventh day of week. (Weekly pattern) |
monthDate | radio | The BySpecificDate radio button. (Monthly pattern) |
monthDateEdit | div | The day of month up/down. (Monthly pattern) |
monthDateMonth | div | The months up/down. (Monthly pattern) |
monthWeekDay | radio | The ByDayType radio button. (Monthly pattern) |
monthWeekDayOptions | select | The occurrence drop-down. (Monthly pattern) |
monthWeekDayExactOptions | select | The day of week drop-down. (Monthly pattern) |
monthWeekDayMonth | div | The months up/down. (Monthly pattern) |
yearExact | radio | The BySpecificDate radio button. (Yearly pattern) |
yearExactOption | select | The month of year drop-down. (Yearly pattern) |
yearExactEdit | div | The day up/down. (Yearly pattern) |
yearWeekDay | radio | The ByDayType radio button. (Yearly pattern) |
yearWeekDayPosOptions | select | The occurrence drop-down. (Yearly pattern) |
yearWeekDayExactOptions | select | The day of week drop-down. (Yearly pattern) |
yearMonthExactOptions | select | The month of year drop-down. (Yearly pattern) |
intervalDays | div | The days up/down. (ByTimeInterval pattern) |
intervalHours | div | The hours up/down. (ByTimeInterval pattern) |
intervalMinutes | div | The minutes up/down. (ByTimeInterval pattern) |
intervalSeconds | div | The seconds up/down. (ByTimeInterval pattern) |
Id of the element | Element type | Description |
---|---|---|
headerElement | div | The header of the form. |
headerClose | a | The header close button in the upper right corner of the form. |