Skip to main content

DxSchedulerCustomFormLayoutItem.Template Property

Specifies the template used to display item content.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor


public RenderFragment Template { get; set; }

Property Value

Type Description

The item template.


You can use the following properties to create a custom edit form for appointments:

Construct the form based on layout items in the same way as when you use the DxFormLayout component. The Scheduler ships with a set of predefined layout items that correspond to items of the default edit form.

If predefined items do not suit your requirements, you can use a custom layout item. Add the DxSchedulerCustomFormLayoutItem to the form layout and use the Template property to define item content.

For example, you can use a custom item to display an editor for a custom appointment property. To pass information about custom properties to the edit form, implement a descendant from the SchedulerAppointmentFormInfo class and assign it in the AppointmentFormShowing event handler.

For more information, refer to the following help topic: Custom Appointment Form.

<DxScheduler StartDate="@DateTime.Today"
    <AppointmentFormLayout Context="formInfo">
        <DxSchedulerCustomFormLayoutItem ColSpanMd="12">
                <div style="margin-left: auto; margin-top: 14px;">
                    <DxCheckBox @bind-Checked="@(((CustomAppointmentFormInfo)formInfo).IsAccepted)" 


@code {
    public class CustomAppointmentFormInfo : SchedulerAppointmentFormInfo {
        public CustomAppointmentFormInfo(DxSchedulerAppointmentItem AppointmentItem, 
                DxSchedulerDataStorage DataStorage) : base(AppointmentItem, DataStorage) { }

        public bool IsAccepted {
            get { return (bool)CustomFields["IsAccepted"]; }
            set { CustomFields["IsAccepted"] = value; }

    void OnAppointmentFormShowing(SchedulerAppointmentFormEventArgs args) {
        args.FormInfo = new CustomAppointmentFormInfo(args.Appointment, DataStorage);
    // ...

Run Demo: Scheduler - Custom Fields and Appointment Form

Watch Video: Scheduler - Customization

See Also