Appointment Templates

Monday, June 14
Tuesday, June 15
Wednesday, June 16 Thursday, June 17 Friday, June 18
9 00
10 00
11 00
12 PM
1 00
2 00
3 00
4 00
5 00

The DevExpress Scheduler allows you to use templates to customize the appearance of individual appointments:

These properties obtain a DxSchedulerAppointmentView object that contains information about appointment settings. To access this object, use the template's context parameter.

To define appointment appearance, use HTML markup within the HorizontalAppointmentTemplate and VerticalAppointmentTemplate tags.

Custom Fields and Appointment Form

Monday, June 14
Tuesday, June 15
Wednesday, June 16 Thursday, June 17 Friday, June 18
8 00
9 00
10 00
11 00
12 PM
1 00
2 00
3 00
4 00
5 00
6 00

The DevExpress Blazor Scheduler allows you to add custom properties to appointments, labels, and status items. To create these custom elements, define custom fields in source objects and add them to the CustomFieldMappings collection. In this demo, an appointment’s source object includes an Accepted custom field that is mapped to the IsAccepted appointment property. The property value is used in the HorizontalAppointmentTemplate and VerticalAppointmentTemplate to change appointment appearance.

The Scheduler also allows you to customize the appointment edit form as needed. Use the following properties to construct your custom form layout:

  • AppointmentFormLayout - the layout of the pop-up form that appears when you create an appointment and click the expand button or when you edit an appointment.
  • AppointmentCompactFormLayout - the layout of the compact form that appears when you create an appointment.

The Scheduler ships with a set of predefined form layout items (DxSchedulerSubjectFormLayoutItem, DxSchedulerStartDateFormLayoutItem, DxSchedulerStartTimeFormLayoutItem, etc). You can also add a custom item (DxSchedulerCustomFormLayoutItem) and define its Template property. In this demo, custom layout items are used to display the IsAccepted property’s editor and its validation summary.

To pass information about custom properties to the edit form, implement a custom descendant from the SchedulerAppointmentFormInfo class and assign it in the AppointmentFormShowing event handler.

To enable form validation, mark appointment properties in your custom class with annotation attributes and set the Scheduler’s ValidateEditForm property to true.

You can also specify which appointment form users can use to create and edit appointments: the compact form, the pop-up form, or both. To do this, use the AppointmentFormMode property.

Custom Appointment Tooltip

Tuesday, June 15
Wednesday, June 16
John Heart Samantha Bright Arthur Miller John Heart Samantha Bright Arthur Miller
9 00
10 00
11 00
12 PM
1 00
2 00
3 00
4 00
5 00

The DevExpress Scheduler allows you to customize tooltips that appear when a user clicks appointments. Use the AppointmentTooltipTemplate property to specify custom content and layout. In the markup for this property, use the context parameter to access appointment data. This parameter returns a SchedulerAppointmentTooltipInfo object.

You can also use the ShowAppointmentTooltip property to show or hide the tooltip.

Restrict User Actions

Sunday, June 13 Monday, June 14
Tuesday, June 15
Wednesday, June 16 Thursday, June 17 Friday, June 18 Saturday, June 19
9 00
10 00
11 00
12 PM
1 00
2 00
3 00
4 00
5 00

You can prevent users from creating, updating, and deleting appointments. To do this, set the AllowCreateAppointment, AllowEditAppointment, and AllowDeleteAppointment properties to false.