6

I want my webpage to display date and time in user's locale.

It seems Intl is supported by most browsers now (see Can I Use Intl). I can acquire browser time zone just fine by using Intl.DateTimeFormat().resolvedOptions().timeZone. I hoped I will be able to emit a date-time using my current locale, by doing:

var date = new Date(2017, 11, 31, 23, 59, 59);
var format = new Intl.DateTimeFormat(
  undefined, // locale
  {
    year: "numeric",
    month: "numeric",
    day: "numeric",
    hour: "numeric",
    minute: "numeric",
  }
)

console.log(format.format(date))

I am using Chrome on Windows. My Windows OS locale is set as "Czech Republic". My preferred site language is set to "Czech" in Chrome, however the browser itself is is set to use US English.

With those settings the output is done in 12 H format, as if my locale was en-us. As soon as I switch my Chrome browser to use Czech as its presentation language, the time switches to 24 format.

I think I must be missing something obvious - is webpage really unable to use the locale user is using, or is this some bug or incompleteness in Chrome Intl implementation?

Suma
  • 33,181
  • 16
  • 123
  • 191
  • In my opinion, datetime format should be hard-coded and/or reflect dcoument's locale `document.documentElement.lang` (if set), not reader's or navigator´s locale – JukkaP Jul 23 '20 at 09:47
  • @JukkaP All well behaved native applications respect user's locate settings (which user sets in the system). Why should be applications / web pages displayed in a web browser be different? – Suma Jul 29 '20 at 19:26
  • If you read a document written with 'en-GB' locale, you would expect document's date and time formatting respect document locale, not Finnsih or Chech language. – JukkaP Jul 31 '20 at 09:28
  • You wouldn't like if you saw a sentence like this: "I wrote this message on 31. heinäkuuta kello 12.37, adnd today is perjantai. – JukkaP Jul 31 '20 at 09:38
  • You talk about documents, I talk about applications. It is common for an application to use my locale to display dates and times (Czech date formats and time formats, including dates like 31. července 2020) even if the application is using US or UK English. Many web pages are more like applications than documents. – Suma Jul 31 '20 at 09:51
  • If application's language is Finnish, I wan't also dates being formatted in Finnish. Accordingly, application whose language is English, shoud have English-style dates. Whether we are talking about documents or applications, doesn't matter. – JukkaP Jul 31 '20 at 11:08
  • 1
    Desktop applications (like LibreCalc or Excel) seem to differ. They allow me to process my data in my own locale, even when I prefer to use them in an English translation. When talking about document, the application may be Finnish, but the document it is processing may be Czech (even if the "document" are only dates and times, like in a spreadsheet) . – Suma Jul 31 '20 at 11:38

1 Answers1

2

I found following is more reliable on Chrome: one can use navigator.languages[0] to get the locale defined by the language the user is preferring for the content. See also Best way to determine user's locale within browser for a discussion regarding browser compatibility.

function getLocale() {
    return (navigator.languages && navigator.languages.length) ? navigator.languages[0] : navigator.language;
}


var locale = getLocale();
var date = new Date(2017, 11, 31, 23, 59, 59);
var format = new Intl.DateTimeFormat(
  locale,
  {
    year: "numeric",
    month: "numeric",
    day: "numeric",
    hour: "numeric",
    minute: "numeric",
  }
)

console.log(format.format(date))

Still it seems a shame one cannot access the system wide choice of locale the user has made.

Suma
  • 33,181
  • 16
  • 123
  • 191