Skip to main content
All docs
V23.2

DxScheduler.SaveAppointmentAsync(DxSchedulerAppointmentItem) Method

Saves appointment changes to a data source.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v23.2.dll

NuGet Package: DevExpress.Blazor

Declaration

public Task<DxSchedulerAppointmentItem> SaveAppointmentAsync(
    DxSchedulerAppointmentItem appointment = null
)

Optional Parameters

Name Type Default Description
appointment DxSchedulerAppointmentItem null

The appointment to be saved. null to save the appointment that is displayed in the edit form.

Returns

Type Description
Task<DxSchedulerAppointmentItem>

An asynchronous operation that returns the saved appointment. Returns null if the appointment cannot be saved.

Remarks

Use the SaveAppointmentAsync method to save appointment changes to a data source. You can pass a specific appointment (DxSchedulerAppointmentItem ) or pass an appointment that is currently displayed in the edit form (null).

The code below demonstrates how to customize the header of the compact edit form (AppointmentCompactFormHeaderTemplate). The header displays the following elements:

  • An appointment subject.
  • A custom Save button. The Click event handler uses SaveAppointmentAsync method to save appointment changes.
  • A custom Delete button. The Click event handler uses DeleteAppointmentAsync(DxSchedulerAppointmentItem) 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