Skip to main content
All docs
V25.1
  • DxScheduler.SaveAppointmentAsync(DxSchedulerAppointmentItem) Method

    Saves appointment changes to a data source.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.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 following code snippet customizes 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