Appointment Editing in WinUI Scheduler (SfScheduler)

29 Jun 20229 minutes to read

This section explains how to handle appointment editing in WinUI scheduler and also explains about the appointment resizing.

Creating appointments

The Scheduler supports adding new appointments by using the Appointment Editor UI dialog. Open this editor dialog by double-clicking on a time cell or month cell or view header.

NOTE

  • If AllowViewNavigation is true, the current view should be navigated to the respective day or timeline day views by single-clicking on the date in the view header. Other than the date by double-clicking on the view header cell, the appointment editor window will be opened, and by default, the AllDay checkbox will be checked in the appointment editor window.
  • All-day appointments can be created by double-clicking on the view header and not applicable for the month view header.

Editing appointment

The Scheduler supports editing the existing appointments by using the Appointment Editor UI dialog. Open this dialog by double-clicking on the appointment.

edit-an-appointment-using-appointment-editor-dialog-in-winui-scheduler

The appointments in the appointment editor dialog can be edited. These changes will be saved back in the appointment and mapped data object when using data binding.

Edit recurring appointment

The Scheduler supports editing the recurrence appointment. The following editor dialog will appear while editing the recurrence appointment to select whether to edit only the particular occurrence or recurrence series.

edit-an-recurring-appointment-using-recurring-appointment-editor-dialog-in-winui-scheduler

Handle the opening of recurrence popup window using the EditMode property in the RecurringAppointmentBeginningEditEventArgs by handling the RecurringAppointmentBeginningEdit event.

RecurringAppointmentBeginningEdit Event

The opening of the recurrence popup editor dialog can be handled using the EditMode property in the RecurringAppointmentBeginningEditEventArgs by handling the RecurringAppointmentBeginningEdit event.

EditMode: Gets or Sets the edit mode to perform the edit option to edit the occurrence or series for a recurrence appointment. The default value of the EditMode is User.

  • User: The default editor content dialog will appear when editing a recurrence appointment to select the edit option from the end-user itself.
  • Occurrence: Edit a particular occurrence alone in a recurrence appointment. The default editor content dialog will not appear.
  • Series: Edit the entire series in a recurrence appointment. The default editor content dialog will not appear.
this.scheduler.RecurringAppointmentBeginningEdit += scheduler_RecurringAppointmentBeginningEdit;

private void scheduler_RecurringAppointmentBeginningEdit(object sender, RecurringAppointmentBeginningEditEventArgs e)
{
	// Get or set the edit mode to perform the edit option.
	e.EditMode = RecurringAppointmentEditMode.Occurrence;
}

AppointmentEditorOpening event

While opening the appointment editor UI dialog to add or update appointment, the Scheduler notifies the AppointmentEditorOpening event.

The AppointmentEditorOpeningEventArgs has following members which provides the information for the AppointmentEditorOpening event.

Appointment: Gets the selected appointment details which are being updated. It will be null when adding a new appointment using the appointment editor.

DateTime: Get the DateTime of time slot or month cell where the user double clicked.

AppointmentEditorOptions: Specifies to show the editors for the ScheduleAppointment details in SchedulerAppointmentEditorView while double clicking the scheduler.

Cancel: To avoid the default appointment editor from showing by enabling this property.

For example, to use a custom appointment editor dialog instead of a default appointment editor content dialog, you can handle the AppointmentEditorOpening event.

this.Schedule.AppointmentEditorOpening += Schedule_AppointmentEditorOpening;

private void Schedule_AppointmentEditorOpening(object sender, AppointmentEditorOpeningEventArgs e)
{
    //To handle the default appointment editor content dialog by setting the e.Cancel value to true.
    e.Cancel = true;

    if (e.Appointment != null)
    {
        //Display the custom appointment editor content dialog to edit the appointment.
    }
    else
    {
        //Display the custom appointment editor content dialog to add new appointment.
    }
}
  • Resource: Gets the resource of an appointment under which the appointment is located.

Visible/Collapse the built-in editors in appointment editor dialog

Programmatically visible or collapse the editors by setting the AppointmentEditorOptions property in SchedulerAppointmentEditorView. By default, the value of AppointmentEditorOptions is set to AppointmentEditorOptions.All in the SchedulerAppointmentEditorView that displays all the appointment editors. The following code shows how to collapse the Recurrence editor by handling the AppointmentEditorOptions event.

this.Schedule.AppointmentEditorOpening += Schedule_AppointmentEditorOpening;

private void Schedule_AppointmentEditorOpening(object sender, AppointmentEditorOpeningEventArgs e)
{
    e.AppointmentEditorOptions = AppointmentEditorOptions.All | (~AppointmentEditorOptions.Background & ~AppointmentEditorOptions.Foreground & ~AppointmentEditorOptions.Reminder & ~AppointmentEditorOptions.Resource);
}

collapse-build-in-editors-of-appointment-editor-dialog-in-winui-scheduler

NOTE

  • The basic editors such as Subject, Location, Start, and End of the scheduler appointment editor cannot be collapsed.

AppointmentEditorClosing event

While closing the appointment editor content dialog after adding or editing the schedule appointment, the Scheduler notifies the AppointmentEditorClosing event.

The AppointmentEditorClosingEventArgs has the following members who provides the information for the AppointmentEditorClosing event.

Handled: Gets or sets a value that indicates whether the scheduler can update the underlying appointments collection or appointment based on the action performed in the appointment editor. If the value is true, the scheduler does not perform the action and we have to write the code in the handler and perform the action. The default value of Handled is false.

Appointment: Gets the details of updated or newly added appointment.

Cancel: To avoid the default appointment editor closing by enabling this property.

Action: Gets the action of appointment which is Add, Edit, Delete or Cancel.

  • Add: Specifies that appointment is newly added using the appointment editor.
  • Edit: Specifies that appointment is edited using the appointment editor.
  • Delete: Specifies that appointment is deleted using the appointment editor.
  • Cancel: Specifies that appointment editing is canceled using the appointment editor.

For example, to handle the appointment adding for today’s date, the user can handle the AppointmentEditorClosing event.

this.Schedule.AppointmentEditorClosing += Schedule_AppointmentEditorClosing;

private void Schedule_AppointmentEditorClosing(object sender, AppointmentEditorClosingEventArgs e)
{
    var appointment = e.Appointment as ScheduleAppointment;
    if (appointment != null)
    {
        if (appointment.StartTime.Day == DateTime.Now.Day)
            e.Handled = true;
    }
}
  • Resource: Gets the resource collection of edited appointment.

Disable appointment editing

To disable appointment editing functionality, Set the AppointmentEditFlag property to None. In this case, the add, edit, resize and drag & drop the appointments cannot be performed.

<scheduler:SfScheduler x:Name="Schedule"  
                       ViewType="Week"
                       AppointmentEditFlag="None">
</scheduler:SfScheduler>

Delete appointments

The Scheduler supports two ways to remove the selected appointment.

  1. Pressing the delete key.
  2. Using the appointment editor dialog.

Delete recurring appointment

The Scheduler supports deleting the recurrence appointment. The following editor dialog will appear when user deletes the recurrence appointment. Select the delete option to make the changes for occurrence or appointment series.

delete-an-appointment-using-recurring-appointment-editor-dialog-in-winui-scheduler

AppointmentDeleting event

The Scheduler notifies the AppointmentDeleting event, when user deletes the appointment.

The AppointmentDeletingEventArgs has the following members who provides information for the AppointmentDeleting event.

Appointment: Gets the selected appointment to delete.

Cancel: To avoid appointment deleting by enabling this property.

this.Schedule.AppointmentDeleting += Schedule_AppointmentDeleting;

private void Schedule_AppointmentDeleting(object sender, AppointmentDeletingEventArgs e)
{
    //To notify when restrict appointment delete.
    e.Cancel = true;
}

Appointment resizing

The Scheduler has support to resize the selected appointment. This support is available for all views except the Month view.

Disable appointment resize

The Scheduler supports disabling the appointment resizing by setting the AppointmentEditFlag property except Resize. In this case, the appointment resizing cannot be performed.

<scheduler:SfScheduler x:Name="Schedule"  
                       ViewType="Week"
                       AppointmentEditFlag="Add,DragDrop,Edit">
</scheduler:SfScheduler>
this.Schedule.AppointmentEditFlag = AppointmentEditFlag.Add | AppointmentEditFlag.DragDrop | AppointmentEditFlag.Edit;

AppointmentResizing event

The Scheduler notifies the AppointmentResizing event, when the user resize an appointment.

The AppointmentResizingEventArgs has the following members who provides information for AppointmentResizing event.

Appointment: Gets the appointment being resized.

Action: Gets the current action being performed while resizing an appointment.

  • Starting: Denotes an event that occurred when the user mouse over the appointment to resize an appointment (before showing resize cursor).
  • Progressing: Denotes an event that occurred when the user resizing an appointment.
  • Committing: Denotes an event that occurred when user ends the resizing by releasing pointer to commit the changed to underlying appointment.
  • Canceling: Denotes the event that occurred before canceling the resize operation when user press the Esc key when resizing operation in progress.

StartTime: Gets the updated start time of appointment in the resizing operation.

EndTime: Gets the updated end time of appointment in the resizing operation.

CanContinueResize: Gets or sets a value indicating whether the resizing operation should be continued or canceled. Set this property when Action is Starting, Progressing, Canceling.This property will not have any effect on when Action is Committing.

CanCommit: Gets or sets a value indicating whether to update underlying appointment when resizing operation is completed. Set this property when Action is Canceling and Committing. This property will not have any effect on when Action is Starting and Progressing.

this.Schedule.AppointmentResizing += Schedule_AppointmentResizing;

private void Schedule_AppointmentResizing(object sender, AppointmentResizingEventArgs e)
{
    //To notify when resizing the appointment. 
}
  • Resource: Gets the resource of an appointment under which the appointment is located.