DxSchedulerDataStorage.AppointmentStatusMappings Property

Specifies an object that defines how status item properties are mapped to data source fields.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

public DxSchedulerAppointmentStatusMappings AppointmentStatusMappings { get; set; }

Property Value

Type	Description
DxSchedulerAppointmentStatusMappings	Stores information on how data source fields are mapped to appointment status properties.

Remarks

The appointment displays its availability status as a colored strip on the left edge. The Scheduler has a built-in collection of status values:

You can use the AppointmentStatusMappings property to create a collection of your own status values:

1. Create a DxSchedulerDataStorage object that uses a constructor without parameters and specify appointment mappings. See the DxSchedulerAppointmentMappings class description for more information.
2. Declare a class (for instance, StatusObject) that stores status options and an ID.
3. Create a collection of status source objects (StatusObject class instances) and define their options.
4. Assign the newly created collection to the storage’s AppointmentStatusSource property.
5. Assign the DxSchedulerAppointmentStatusMappings object to the AppointmentStatusMappings property. In this object, map the status item’s source fields to the status item’s properties.
6. Optional. You can create custom fields for status items. Define custom fields in the status item’s source object and add these fields to the CustomFieldMappings collection. For instance, the following code snippet adds the MyCustomField field to the StatusObject and maps this field to the status item’s MyCustomProperty.

Razor

<DxScheduler StartDate="@DateTime.Today"
             DataStorage="@DataStorage">
    <DxSchedulerWeekView ShowWorkTimeOnly="true"></DxSchedulerWeekView>
</DxScheduler>

@code {
    DxSchedulerDataStorage DataStorage = new DxSchedulerDataStorage() {
        // Specify appointment mappings here.
        // ...
        AppointmentStatusSource = StatusCollection.GetStatuses(),
        AppointmentStatusMappings = new DxSchedulerAppointmentStatusMappings() {
            Id = "Id",
            Caption = "StatusCaption",
            Color = "StatusColor",
            // Uncomment the line below and comment the line above to specify other style options.
            //CssClass = "CssClass",
            // Map the source object's custom field to the status item's custom property.
            CustomFieldMappings = new List<DxSchedulerCustomFieldMapping> {
                new DxSchedulerCustomFieldMapping { Name = "MyCustomProperty", Mapping = "MyCustomField" }
            }
        }
    };
}

CSS

.status1-style {
    background-color: lightblue;
    border-color: blue;
}
.status2-style {
    background-color: lightgreen;
    border-color: green;
}

StatusObject

public class StatusObject {
    public int Id { get; set; }
    public string StatusCaption { get; set; }
    public System.Drawing.Color StatusColor { get; set; }
    public string CssClass { get; set; }
    public string MyCustomField { get; set; } // A custom field
}

StatusCollection

public static class StatusCollection {
    public static List<StatusObject> GetStatuses() {
        DateTime date = DateTime.Today;
        var dataSource = new List<StatusObject>() {
            new StatusObject() {
                Id = 1,
                StatusCaption = "Resolved",
                StatusColor = System.Drawing.Color.LightBlue,
                // Uncomment the line below and comment the line above to specify other style options.
                //CssClass = "status1-style",
                MyCustomField = "Custom text for the 'Resolved' status",
            },
            new StatusObject() {
                Id = 2,
                StatusCaption = "In process",
                StatusColor = System.Drawing.Color.LightGreen,
                // Uncomment the line below and comment the line above to specify other style options.
                //CssClass = "status2-style",
                MyCustomField = "Custom text for the 'In process' status",
            }
        };
        return dataSource;
    }
}

Note

When you use templates to customize appointment appearance, the Color and CssClass property values are not applied to appointments. To access these property values in the template, use the context.Status parameter.