jquery fullcalendar full translation

Question

I'm correctly use JQuery FullCalendar in a project but I want to translate some data.

I read the documentation so I do this :

monthNames:['Janvier','Février','Mars','Avril','Mai','Juin','Juillet','Août','Septembre','Octobre','Novembre','Décembre'],
monthNamesShort:['janv.','févr.','mars','avr.','mai','juin','juil.','août','sept.','oct.','nov.','déc.'],
dayNames: ['Dimanche','Lundi','Mardi','Mercredi','Jeudi','Vendredi','Samedi'],
dayNamesShort: ['Dim', 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam'],
titleFormat: {
    month: 'MMMM yyyy',
    week: "d[ MMMM][ yyyy]{ - d MMMM yyyy}",
day: 'dddd d MMMM yyyy'
},
columnFormat: {
    month: 'ddd',
week: 'ddd d',
day: ''
},
axisFormat: 'H:mm', 
timeFormat: {
    '': 'H:mm', 
agenda: 'H:mm{ - H:mm}'
},
firstDay:1,
buttonText: {
    today: 'aujourd\'hui',
    day: 'jour',
    week:'semaine',
    month:'mois'
}, 
header: {
    left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay'
},

I use eventClick and select function to edit the calendar, it's work well. But when I get the event.start or event.end inside one of this function the date is not translate... any idea to fix this ?

Answer 1

FullCalendar has built in .parseDate and .formatDate functions to assist with translating IETF dates.

First use parseDate to convert the date string into a JavaScript Date object. After that, call formatDate with a format string and an options object. This options object should contain the translated values for monthNames, monthNamesShort, dayNames, and dayNamesShort.

Here's an example function for formatting:

var formatDate = function(dateString) {
    var parsedDate = $.fullCalendar.parseDate(dateString);
    return $.fullCalendar.formatDate(parsedDate, 'dddd d MMMM yyyy',options);
}

If your formatting needs are more complex, you could also take a look at the Date.js library which has good internationalization support.

Answer 2

french speaking:

// time formats
titleFormat: {
    month: 'MMMM yyyy',
    // week: "MMM d[ yyyy]{ '—'[ MMM] d yyyy}",
    week:"'Semaine du' dd [yyyy] {'au' [MMM] dd MMM yyyy}",
    day: 'dddd dd MMM yyyy'
},
columnFormat: {
    month: 'ddd',
    week: 'ddd dd/M',
    day: 'dddd dd/M' 
},
timeFormat: { // for event elements
    '': 'HH:mm'
},