Blazor: <InputDate ... @bind-Value:format="dd-MM-yyyy"> doesn't format.

See original GitHub issue

Describe the bug

With Blazor <InputDate … @bind-Value:format=“dd-MM-yyyy”> the date doesn’t format.

With <input @bind=“starship.ProductionDate” @bind:format=“dd-MM-yyyy” /> it `does.

See “InputDate” > https://docs.microsoft.com/en-us/aspnet/core/blazor/forms-validation?view=aspnetcore-3.0

Screenshot

Screenshot_2019-10-25 ICTZ(1)

Additional context

.NET Core SDK (reflecting any global.json): Version: 3.1.100-preview1-014459 Commit: ac3b59712d

Runtime Environment: OS Name: Windows OS Version: 10.0.18362 OS Platform: Windows RID: win10-x64 Base Path: C:\Program Files\dotnet\sdk\3.1.100-preview1-014459\

Host (useful for support): Version: 3.1.0-preview1.19506.1 Commit: bbf5542781

.NET Core SDKs installed: 2.1.802 [C:\Program Files\dotnet\sdk] 2.2.402 [C:\Program Files\dotnet\sdk] 3.0.100 [C:\Program Files\dotnet\sdk] 3.1.100-preview1-014459 [C:\Program Files\dotnet\sdk]

.NET Core runtimes installed: Microsoft.AspNetCore.All 2.1.13 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.All] Microsoft.AspNetCore.All 2.2.7 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.All] Microsoft.AspNetCore.App 2.1.13 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App] Microsoft.AspNetCore.App 2.2.7 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App] Microsoft.AspNetCore.App 3.1.0-preview1.19508.20 [C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App] Microsoft.NETCore.App 2.1.13 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App] Microsoft.NETCore.App 2.2.7 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App] Microsoft.NETCore.App 3.1.0-preview1.19506.1 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App] Microsoft.WindowsDesktop.App 3.1.0-preview1.19506.1 [C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App]

To install additional .NET Core runtimes or SDKs: https://aka.ms/dotnet-download

Issue Analytics

State:
Created 4 years ago
Comments:5 (5 by maintainers)

Top GitHub Comments

1reaction

SteveSandersonMScommented, Oct 28, 2019

I don’t live in the US 😃 I’m British.

I’m afraid the feature you’re asking for is just not something that Blazor controls. The date format within an <input type=date> is completely controlled by the browser. See https://stackoverflow.com/a/9519493 for info.

If using a non-browser-controlled format is an absolute requirement for you, then you’ll need to not use <input type=date> or InputDate which wraps that. Instead, consider using or implementing an alternative date picker, for example via JS interop. I know that’s not as convenient, but I’m afraid that is just the feature set that browsers offer.

1reaction

javiercncommented, Oct 25, 2019

@JeepNL thanks for contacting us.

@SteveSandersonMS can you take a look? I’m not sure how “@bind” works with components.

Top Results From Across the Web

How to format the date using local culture using the blazor ...

I am using the tag in my Blazor app. But how can i format the date using my own culture ? <InputDate class="form-control"...

Blazor RZ10001 The type of component 'InputDate' cannot ...

Blazor RZ10001 The type of component 'InputDate' cannot be inferred based on the values provided. produces the following: Error RZ10001 The ...

Editing form data

The InputDate components binds a DateTime property to an HTML <input> element with type="date" . This component will bind to a nullable property,...

Blazor DatePicker

InputDate component is rendered as <input type=date> . This is a built-in HTML input type, and as per the HTML spec, the internal...

Date Picker

Datepicker and DatepickerControl components are built on top of Blazor's InputDate class, and support all standard behaviors for form model and validation.