Skip to main content
All docs
V23.2

DxDateEditSettings.Format Property

Specifies the pattern used to format date editor values.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v23.2.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(null)]
[Parameter]
public string Format { get; set; }

Property Value

Type Default Description
String null

The format pattern. If it is not set, the short date format is applied.

Remarks

Use the Format property to format the date editor value in edit mode when the editor is focused, and use the DisplayFormat property to format the editor’s display value when the editor is not focused. If the DisplayFormat property is not set, Format is applied in display and edit modes.

Refer to the Standard Date and Time Format Strings and Custom Date and Time Format Strings help topics for more information about supported formats.

The following example demonstrates how to apply the long date format in display mode and the short date format in edit mode:

<DxGrid Data="@employees" PageSize="6" EditMode="GridEditMode.EditRow">
    <Columns>
        <DxGridCommandColumn />
        <DxGridDataColumn FieldName="FirstName" />
        <DxGridDataColumn FieldName="LastName" />
        <DxGridDataColumn FieldName="HireDate" >
             <EditSettings>
                <DxDateEditSettings DisplayFormat="D" Format="d"/>
            </EditSettings>
        </DxGridDataColumn>
        <DxGridDataColumn FieldName="Email" />
    </Columns></DxGrid>

@code {
    Employee[]? employees;

    protected override async Task OnInitializedAsync() {
        employees = await EmployeeData.GetData();
    }
}

Grid Date Editor - Format

If the datepicker is displayed as a scroll picker, use the ScrollPickerFormat property to define a date format for each scroll picker part (day, month, and year).

To specify the value format at runtime, use the IDateEditSettings.Format property instead.

Implements

See Also