Blazorise DateEdit component

DateEdit is an input field that allows the user to enter a date by typing or by selecting from a calendar overlay.

A native date <input> component built around the <input type="date">.

Being built around native <input type="date"> input element, the DateEdit component comes with a few limitations that you must be aware of. First and foremost, the input display format is fully controlled by the browser and the system locale. This means that for you to change the input format you would need to change the browser settings.

<DateEdit TValue="DateTime?" />

Binding

<DateEdit TValue="DateTime?" @bind-Date="@selectedDate" />

@code{
    DateTime? selectedDate;
}

<DateEdit TValue="DateTime?" Date="@selectedDate" DateChanged="@OnDateChanged" />

@code{
    DateTime? selectedDate;

    void OnDateChanged( DateTime? date )
    {
        selectedDate = date;
    }
}

<DateEdit TValue="DateTime?" InputMode="DateInputMode.DateTime" />

<Field>
    <Button Color="Color.Primary" Clicked="@(()=>dateEditRef.ShowPicker())">
        Show Picker
    </Button>
</Field>
<Field>
    <DateEdit @ref="@dateEditRef" TValue="DateTime" />
</Field>

@code {
    DateEdit<DateTime> dateEditRef;
}

Functions

API

Attributes