3

I have a input type="month" control and I am using Angular UI bootstrap as well. When I select a month in IE it is shown as yyyy-MM format. But in google chrome it s shown as MMMM yyyy format.

When localized the months in calendar control is shown as localized text but after the selection in the input box it is showing the english month name.

Desired solution: Either show the localized month in the input box or change the format as yyyy-MM in google chrome as well.

Praveen Prasannan
  • 7,093
  • 10
  • 50
  • 70

1 Answers1

3

One thing to note is that the displayed date format differs from the actual value; most user agents display the month and year in a locale-appropriate form, based on the set locale of the user's operating system, whereas the date value is always formatted yyyy-MM.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/month

So since this is based on the date locale format, I don't think you're going to be able to get what you want by using the <input type=month>--however the value that you get from this should always be in YYYY-MM format per the specs.

If how the date is displayed is important, I'd consider some of the pre-HTML5 solutions out there for date controls. e.g like this: https://jqueryui.com/datepicker/

Andrew Bowman
  • 798
  • 9
  • 21
  • 2
    I don't understand the downvote. This is the correct answer. The display format is determined by the client and there is nothing you can do about it. And from a UX point of view, you shouldn't. The user expects date fields to behave the same on every website, so we developers should use these native client features as much as possible and only fall back to custom datepickers (like AngularJS-UI bootstrap, jQueryUI or whatever) when the client does not support the input type. – masterfloda Dec 18 '17 at 21:46