Lesson 3 - Create a Custom Edit Appointment Form with Custom Fields

• May 22, 2020
• 4 minutes to read

This document describes a way of substituting a standard Edit Appointment form with a custom one. This can be useful if you bind a scheduler control to data with custom fields and wish to provide end-users with the capability to edit these fields in a custom Edit Appointment form. To simplify this example, we will disable the Appointment Recurrence feature and prevent end-users from working with recurring appointments via the Appointment Recurrence dialog.

Follow the steps below.

• Specify Custom Field Mappings
• Create a Custom Edit Appointment Form
• Create a Controller Supporting Custom Fields
• Assign a Controller to a Custom Edit Appointment Form
• Replace a Standard Form with a Custom One
• Disable the Appointment Recurrence Feature
• Result

Specify Custom Field Mappings

1. Open the Silverlight application with the SchedulerControl, which was created in Lesson 2 of the current Getting Started section.

2. This SchedulerControl is already bound to the required data, and all standard mappings for appointment and resource properties are specified. Add a custom field mapping for the non-standard appointment field, which has the "ContactInfo" name in the datasource. To do this, add the following XAML markup to the MainPage.xaml file.

   XAML

   
   <dxsch:SchedulerStorage>
       <dxsch:SchedulerStorage.AppointmentStorage>
           <dxsch:AppointmentStorage>
               <dxsch:AppointmentStorage.Mappings>
                   <!---->
               </dxsch:AppointmentStorage.Mappings>
   
               <!--Insert this block-->            
               <dxsch:AppointmentStorage.CustomFieldMappings>
                   <dxsch:SchedulerCustomFieldMapping 
                       Name="Contact"
                       Member="ContactInfo"
                       ValueType="String"/>
               </dxsch:AppointmentStorage.CustomFieldMappings>
               <!--End of the block-->
   
           </dxsch:AppointmentStorage>
       </dxsch:SchedulerStorage.AppointmentStorage>
   
       <dxsch:SchedulerStorage.ResourceStorage>
           <!---->
       </dxsch:SchedulerStorage.ResourceStorage>
   </dxsch:SchedulerStorage>
   

Create a Custom Edit Appointment Form

1. In the Solution Explorer, right-click SilverlightApplication1 and select Add / New Item..., or press CTRL+SHIFT+A.

   

2. In the invoked Add New Item dialog, select Silverlight User Control and set the CustomAppointmentForm.xaml name.

   

3. Add controls to edit the following properties of appointments.

   • Subject - the TextEdit control;
   • Start, End - DateEdit controls for data values, ButtonEdit controls for time values;
   • AllDay - the CheckEdit control;
   • Label - the AppointmentLabelEdit control;
   • Status - the AppointmentStatusEdit control;
   • Contact (custom field) - the TextEdit control.

   To add these controls and specify appointment properties that will be edited via these controls, overwrite the CustomAppointmentForm.xaml file as follows.

Create a Controller Supporting Custom Fields

Since our application's scheduling data contain a custom field (Contact), which should be edited and saved via the custom Edit Appointment form, it is necessary to inherit from the AppointmentFormController class and write properties to support a mapped custom field.

Open the CustomAppointmentForm.xaml.cs (CustomAppointmentForm.xaml.vb) code-behind file and add the CustomAppointmentFormController class as follows.

Assign a Controller to a Custom Edit Appointment Form

Implement methods for initializing form controls, input validation and save the information using a descendant of the AppointmentFormController class.

Replace a Standard Form with a Custom One

Handle the SchedulerControl.EditAppointmentFormShowing event to specify your custom form as the destination container, instead of the default one.

XAML

<dxsch:SchedulerControl Name="schedulerControl1" 
                        HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
                        ActiveViewType="Week"
                        GroupType="Resource"
                        EditAppointmentFormShowing="schedulerControl1_EditAppointmentFormShowing">

C#

private void schedulerControl1_EditAppointmentFormShowing(object sender,
    EditAppointmentFormEventArgs e) {
    e.Form = new CustomAppointmentForm(this.schedulerControl1, e.Appointment);
}

VB.NET

Private Sub schedulerControl1_EditAppointmentFormShowing(sender As System.Object, _
                                                            e As EditAppointmentFormEventArgs)
    e.Form = New CustomAppointmentForm(Me.schedulerControl1, e.Appointment)
End Sub

Disable the Appointment Recurrence Feature

The newly created custom Edit Appointment form does not allow end-users to invoke the Appointment Recurrence form and define the recurrence rule. So, to disable the Appointment Recurrence feature and prevent end-users from working with recurring appointments, do not specify mappings for the Appointment.RecurrenceInfo and Appointment.Type standard properties of an appointment (the AppointmentMapping.RecurrenceInfo and AppointmentMapping.Type properties).

In this case, all pattern appointments and exceptions will be displayed as simple (non-recurring) appointments and recurrence information contained in patterns will be ignored. End-users will be prevented from creating and editing recurrent appointments - the New Recurring Appointment and New Recurring Event items will be removed from the context menu.

Result

Run the project. The following image shows the custom Edit Appointment form that will be invoked when you double-click an appointment.

TIP

A complete sample project is available in the DevExpress Code Examples database at http://www.devexpress.com/example=E3603.