DxDateEditSettings.TimeSectionVisible Property

Specifies whether the date editor displays a time section.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(false)]
[Parameter]
public bool TimeSectionVisible { get; set; }

Property Value

Type	Default	Description
Boolean	false	true to display the time section; otherwise, false.

Remarks

Set the TimeSectionVisible property to true to enable time input in a date editor. If enabled, the editor displays the Time tab in the drop-down window and a time input section in the edit box.

The section’s appearance depends on the current culture. If the culture does not use a 12-hour time format, time values are in 24-hour format and the section’s AM/PM column is not displayed.

You can use the DisplayFormat and Format properties to format the time value in display and edit modes, respectively.

<DxGrid Data="@employees" EditMode="GridEditMode.EditRow">
    <Columns>
        <DxGridCommandColumn />
        <DxGridDataColumn FieldName="FirstName" />
        <DxGridDataColumn FieldName="LastName" />
        <DxGridDataColumn FieldName="HireDate" >
             <EditSettings>
                <DxDateEditSettings TimeSectionVisible="true" TimeSectionScrollPickerFormat="tt h m" />
            </EditSettings>
        </DxGridDataColumn>
        <DxGridDataColumn FieldName="Email" />
    </Columns>
</DxGrid>

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

To change the time section visibility at runtime, use the IDateEditSettings.TimeSectionVisible property instead.

Implements

TimeSectionVisible