Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

DxScheduler.DeleteAppointmentAsync(DxSchedulerAppointmentItem) Method

Deletes an appointment.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

C#
public Task DeleteAppointmentAsync(
    DxSchedulerAppointmentItem appointment = null
)

#Optional Parameters

Name Type Default Description
appointment DxSchedulerAppointmentItem null

The appointment to be deleted. null to delete the selected appointment.

#Returns

Type Description
Task

The task that is completed when the appointment is deleted.

#Remarks

Use the DeleteAppointmentAsync method to delete an appointment in code.

The following code snippet customizes the header of the compact edit form (AppointmentCompactFormHeaderTemplate). The header displays the following elements:

  • The appointment’s subject.
  • A custom Save button. The Click event handler uses SaveAppointmentAsync(DxSchedulerAppointmentItem) method to save appointment changes.
  • A custom Delete button. The Click event handler uses DeleteAppointmentAsync method to delete an appointment.
<DxScheduler StartDate="@DateTime.Today"
             DataStorage="@DataStorage"
             @ref="Scheduler">
    <Views>
        <DxSchedulerWeekView ShowWorkTimeOnly="false"
                             TimeIndicatorVisibility="SchedulerTimeIndicatorVisibility.Never"
                             TimeScale="@(new TimeSpan(0,15,0))"
                             WorkTime="@(new DxSchedulerTimeSpanRange(TimeSpan.FromHours(9), TimeSpan.FromHours(18)))"
                             VisibleTime="@(new DxSchedulerTimeSpanRange(TimeSpan.FromHours(8), TimeSpan.FromHours(19)))">
        </DxSchedulerWeekView>
    </Views>
    <AppointmentCompactFormHeaderTemplate>
        <div class="popup-text-header">@context.Subject</div>
        <DxButton Click="@(() => Scheduler.SaveAppointmentAsync())"
                  Text="Save"
                  IconCssClass="btn-icon-save"
                  RenderStyle="ButtonRenderStyle.None"
                  CssClass="custom-button">
        </DxButton>
        <DxButton Click="@(() => Scheduler.DeleteAppointmentAsync())"
                  Text="Delete"
                  IconCssClass="btn-icon-delete"
                  RenderStyle="ButtonRenderStyle.None"
                  CssClass="custom-button">
        </DxButton>
    </AppointmentCompactFormHeaderTemplate>
</DxScheduler>

@code {
    ISchedulerAppointmentActions Scheduler { get; set; }
    DxSchedulerDataStorage DataStorage = new DxSchedulerDataStorage()
        {
            AppointmentsSource = AppointmentCollection.GetAppointments(),
            AppointmentMappings = new DxSchedulerAppointmentMappings()
            {
                Type = "AppointmentType",
                Start = "StartDate",
                End = "EndDate",
                Subject = "Caption",
                AllDay = "AllDay",
                Location = "Location",
                Description = "Description",
                LabelId = "Label",
                StatusId = "Status",
                RecurrenceInfo = "Recurrence"
            }
        };
}

<style>
    .popup-text-header {
        margin-right: auto;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    .custom-button {
        color: white
    }
</style>
See Also