Uppercasing monthnames in momentjs

Viewed 21960

I changed moments locale by setting the following property:

moment.locale(chosenLocale);

Everything seems to work fine. I get the month names and the weekday names according to the selected locale. I also get correct calculation of weeknumber etc.

With default (english) locale i get month names like January, February, etc. I also get weekday names like Monday, Tuesday, etc. For some reason, with danish locale i get all these names lowercased. When formatting a simple weekday, i can just capitalize the first letter but for some more advanced formats where the name might swap order (January 1st vs. 1. Januar) i can't just uppercase the first letter.

I'm using this format to display the month name and day of month:

moment().format('dddd LL')

In danish i get 7. marts 2016 but i really want 7. Marts 2016. Keep in mind, i need the solution to work on all locales, so i can't hardcode the month names - or can I? I tried the following:

moment.locale(chosenLocale);
var __months = moment.months().map(function (m) { return m.toUpperCase() + "TEST"; });
moment.locale(chosenLocale, {
    months : __months
}); 

I would expect (for testing purposes) to get JANUARTEST for danish locale, but i get januartest which hints that the lower case is applied by the framework somewhere else. I also tried to set the months property to a function according the the api docs and then return the uppercase value of the cached month array, which same result as described.

Does anyone have a solution to this?

4 Answers

You can give CSS a try:

.selector .to .lowercase .element { text-transform: capitalize; }

If you have that selector, that should capitalize any string.

Just use .toUpperCase()

Eg:

<Text>TARGET DATE: {Moment("10-jan-20").format('DD MMMM YYYY').toUpperCase()}</Text>

That returns: "TARGET DATE: 10 JANUARY 2020"

I'm having the same issue in Spanish as it is reported in French by Charles Martin. Who ever has translated the Months and Days names in spanish by using all in lowercase should have opted to make the 1st letter in UpperCase like as in English.

With this fix it's relatively easy to convert all .toLowerCase() If we need it.

To convert just the 1st letter to uppercase for the week and month inside the .format('dddd, DD [de] MMMM') is not possible and to make it outside push us to use another function to split , uppercase 1st letter, and joint to process the result.

Until a fix is implemented, I will stick with the solution proposed to update the locale on the fly.

moment.locale('es');
var meses = 'Enero_Febrero_Marzo_Abril_Mayo_Junio_Julio_Agosto_Septiembre_Octubre_Noviembre_Diciembre'.split('_');
var semanas = 'Domingo_Lunes_Martes_Miércoles_Jueves_Viernes_Sábado'.split('_');
moment.updateLocale('es', { months : meses, weekdays : semanas });

There are other things to replace if you need to. Just open the moment-with-locales.js file and search hooks.defineLocale('es' to see all the properties and use the method explained above to change those from outside the library.

Related