3

I am creating webpage using asp.net core. I am trying to change the default date format from English to Swedish in the format yyyy-MM-dd

This is my current model 

[DataType(DataType.Date)]
[Display(Name = "Required delivery date")]
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]
public Nullable<DateTime> DelDt { get; set; }

This is the razorpage

<td><label asp-for="Order.DelDt" class="control-label "></label></td>
    <td><input asp-for="Order.DelDt" asp-format="{0:yyyy-MM-dd}" tabindex=17 class="form-control"></td>

This is what it looks like

enter image description here

how can I change my code so that the date format showed in the image instead is showing the swedish date format yyyy-MM-dd

note: I have also tried to set the html tag to html lang="sv" without success.

enter image description here

Thomas Adrian
  • 3,543
  • 6
  • 32
  • 62
  • [Converting DateTime format using razor](https://stackoverflow.com/questions/4679352/converting-datetime-format-using-razor) – FortyTwo Aug 27 '18 at 11:26

4 Answers4

3

What you're seeing in the browser is the localized date format provided by the user's OS (your OS, likely, in this case). There's a few things going on you should be aware of. First, since you're binding this field to a DateTime (with DataType.Date), Razor is generating an input with type="date". This is an HTML5 input type, which in supported browsers (all modern browsers) will trigger an actual browser "date" control.

Second, an HTML5 date input takes and returns ISO dates YYYY-MM-DD, but the display of that date shown in the input will be localized for the user. You cannot control this display; it is based on the user's culture settings on their OS. As a result, if you were actually using Swedish culture settings, the display here would be what you want. However, you're apparently using en-US culture settings on your OS, so that is what you're seeing. Again, you cannot control this; you just have to trust it will be right, or you can change your OS culture settings to see it in a different format.

Third, that covers supported browsers, but in unsupported browsers (pretty much just IE 9 and under), this will be rendered as a regular text input with no formatting and will allow free text entry by the user in those browsers. As such, if you need to support older browsers, you should use a polyfill or some date input library that will allow you mask/control user input. Depending on what library you end up using, you might be able to explicitly control the format, or it, too, may rely on culture settings, if it's properly localized. You'll need to consult the documentation for whatever library you end up going with.

Finally, if you want explicit control over this input, you can supply the type attribute yourself and set it to text.

<input type="text" asp-for="Order.DelDt" tabindex=17 class="form-control">

Then, you can use whatever client-side solution you like to format the date however you want. This has the benefit of presenting a unified experience across the board for all users and browser types. However, that is also a con as much as it's a pro. The date input type has deep integration on mobile devices and generally presents a far better user-experience there. If you do end up using a regular text input, you should ensure that whatever client-side library you use presents a suitable experience on mobile.

Chris Pratt
  • 232,153
  • 36
  • 385
  • 444
  • well, thanks. but I have Swedish regional settings in windows and Swedish language in browser. still it display some other date format – Thomas Adrian Aug 27 '18 at 13:16
  • Well, something is not correct. Regardless, the point remains that you cannot control this format here directly. It controlled by the browser, based on OS locale and culture settings. If it's not correct, then something with your OS locale and culture settings is not correct. Simple as that. – Chris Pratt Aug 27 '18 at 13:18
  • I am not sure you are completely right, I have been working on other platforms and there it was possible to control the dates based on the html lang tag and language set in browser – Thomas Adrian Aug 27 '18 at 13:36
  • There may indeed be some variability in how different browsers on different platforms handle this. That's not really the point, though. The point is this: you have no *direct* control of the formatting of the display here, only *indirect* control over the platform(s) you're testing on. If the display is not correct, there's some culture setting *somewhere* that is off. – Chris Pratt Aug 27 '18 at 13:39
  • I just realized that I earlier switched to swedish in the browser but I did not set it as the default display language, after doing that, now everything is working without the need for any culture or asp tag settings. as long as the user have swedish as display language in browser the date is also in swedish format. – Thomas Adrian Aug 27 '18 at 13:57
2

HTML5 date input type takes and returns ISO dates YYYY-MM-DD

.ToString("yyyy-MM-dd")
Shahbaz A.
  • 4,047
  • 4
  • 34
  • 55
Владислав Клишин
  • 21
  • 1
1

To display the date format in dd-mm-yyyy, please follow the instruction as mentioned below,

Data annotation should be like,

[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:dd-MM-yyyy}")]
[DataType(DataType.Date)]
public DateTime StartDate { get; set; }

And view should be as followed,

 <label asp-for="StartDate"></label>
 <input asp-for="StartDate" class="form-control" />
John
  • 323
  • 2
  • 15
0

You can globally change your localization settings by putting this piece of code in the Configure method

var ci = new CultureInfo("sv-SE");
app.UseRequestLocalization(new RequestLocalizationOptions
{
    DefaultRequestCulture = new RequestCulture(ci),
    SupportedCultures = new List<CultureInfo>
    {
        ci,
    },
    SupportedUICultures = new List<CultureInfo>
    {
        ci,
    }
});
Alexandr Sargsyan
  • 656
  • 1
  • 6
  • 21