DxDateEditSettings.PickerDisplayMode Property

Specifies the datepicker type.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(DatePickerDisplayMode.Auto)]
[Parameter]
public DatePickerDisplayMode PickerDisplayMode { get; set; }

Property Value

Type	Default	Description
DatePickerDisplayMode	Auto	An enumeration value.

Available values:

Name	Description
Auto	Mobile and tablet devices display a datepicker as a scroll picker. Other device types display a datepicker as a calendar.
Calendar	All devices display a datepicker as a calendar.
ScrollPicker	All devices display a datepicker as a scroll picker.

Remarks

The date editor adapts a datapicker to the device type. Mobile and tablet devices display a datapicker as a modal scroll picker. Other device types display a datepicker as a calendar.

Set the PickerDisplayMode property to Calendar or ScrollPicker to display a calendar or scroll picker on all devices.

<DxGrid Data="@employees" EditMode="GridEditMode.EditRow">
    <Columns>
        <DxGridCommandColumn />
        <DxGridDataColumn FieldName="FirstName" />
        <DxGridDataColumn FieldName="LastName" />
        <DxGridDataColumn FieldName="HireDate" >
             <EditSettings>
                <DxDateEditSettings ScrollPickerFormat="yyyy MMMM d"
                    PickerDisplayMode="DatePickerDisplayMode.ScrollPicker" />
            </EditSettings>
        </DxGridDataColumn>
        <DxGridDataColumn FieldName="Email" />
    </Columns>
</DxGrid>

@code {
    Employee[]? employees;
    protected override async Task OnInitializedAsync() {
        employees = await EmployeeData.GetData();
    }
}

To change the datepicker type at runtime, use the IDateEditSettings.PickerDisplayMode property instead.

Implements

PickerDisplayMode