DxSchedulerShowAppointmentCompactFormButton Class
A button that invokes an appointment’s compact edit form.
Namespace: DevExpress.Blazor
Assembly: DevExpress.Blazor.v24.2.dll
NuGet Package: DevExpress.Blazor
Declaration
public class DxSchedulerShowAppointmentCompactFormButton :
SchedulerPopupButtonBase
Remarks
Use the DxSchedulerShowAppointmentCompactFormButton
object to add the Show Compact Form button to an appointment’s tooltip, the extended edit form, or recurrence settings form. Declare this object in the following properties:
- AppointmentTooltipHeaderTemplate
- AppointmentTooltipTemplate
- AppointmentFormHeaderTemplate
- AppointmentFormLayout
- RecurrenceSettingsFormHeaderTemplate
The following code snippet creates a custom tooltip. The tooltip header displays the appointment subject (context.Appointment.Subject
), the accepted status if it’s true, and predefined buttons (including DxSchedulerShowAppointmentCompactFormButton
).
@using Data
<DxScheduler StartDate="@DateTime.Today"
DataStorage="@DataStorage"
GroupType="SchedulerGroupType.Date">
<Views>
<DxSchedulerDayView DayCount="2" ShowWorkTimeOnly="true"/>
</Views>
<AppointmentTooltipHeaderTemplate>
<div class="tooltip-text-header">@context.Appointment.Subject</div>
@if (IsAccepted(context)) {
<div style="margin-right: .3em;">(Accepted)</div>
}
<DxSchedulerShowAppointmentCompactFormButton></DxSchedulerShowAppointmentCompactFormButton>
<DxSchedulerDeleteAppointmentButton></DxSchedulerDeleteAppointmentButton>
<DxSchedulerCloseAppointmentButton></DxSchedulerCloseAppointmentButton>
</AppointmentTooltipHeaderTemplate>
<AppointmentTooltipTemplate>
<span style="vertical-align: middle;">
@context.Appointment.Subject
</span>
@if (context.Resource != null)
{
<span style="vertical-align: middle;">
(@context.Resource.Caption)
</span>
}
</AppointmentTooltipTemplate>
</DxScheduler>
@code {
bool ShowAppointmentTooltip { get; set; } = true;
DxSchedulerDataStorage DataStorage = new DxSchedulerDataStorage() {
AppointmentsSource = ResourceAppointmentCollection.GetAppointments(),
AppointmentMappings = new DxSchedulerAppointmentMappings() {
Type = "AppointmentType",
Start = "StartDate",
End = "EndDate",
Subject = "Caption",
AllDay = "AllDay",
Location = "Location",
Description = "Description",
LabelId = "Label",
StatusId = "Status",
RecurrenceInfo = "Recurrence",
ResourceId = "ResourceId",
CustomFieldMappings = new List<DxSchedulerCustomFieldMapping> {
new DxSchedulerCustomFieldMapping{ Name = "Accepted", Mapping = "Accepted" }
}
},
ResourcesSource = ResourceAppointmentCollection.GetResourcesForGrouping(),
ResourceMappings = new DxSchedulerResourceMappings() {
Id = "Id",
Caption = "Name",
BackgroundCssClass = "BackgroundCss",
TextCssClass = "TextCss"
}
};
bool IsAccepted(SchedulerAppointmentTooltipInfo tooltipInfo) =>
(bool)tooltipInfo.CustomFields["Accepted"];
}
<style>
.tooltip-text-header {
margin-right: auto;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
</style>
Inheritance
Object
ComponentBase
SchedulerPopupButtonBase
DxSchedulerShowAppointmentCompactFormButton
See Also