CODEWITHSUNDEEP
javascriptjqueryfullcalendarfullcalendar-scheduler
Aep Saepudin
Aep Saepudin

Reputation: 111

Change Format Time AM / PM to 24 hour Timeline Day fullcalendar

I have a project user jQuery fullcalendar-scheduler, I want to format time to use 24 hour. I have config as below, but it didn't work. Is there something wrong with my code ??

{
        now: moment().format('YYYY-MM-DD'),
        contentHeight: setUpHeight(),
        aspectRatio: 1.8,
        header: {
            left: 'today prev,next',
            center: 'title',
            right: 'timelineDay,timelineMonth'
        },
        timeFormat: 'H(:mm)',
        defaultView: 'timelineDay',
        resourceLabelText: 'Devices',
        resources: resources,
        events: schedules,
        eventRender: function (event, el) {
            el.qtip({
                content: {
                    delay: 1e3,
                    text: function () {
                        return $('#qtip-content-custom').html(event.description);
                    },
                },
                style: { classes: 'qtip__clases' },
                position: {
                    target: 'mouse',
                    adjust: { x: 7, y: 5 }
                },
            });
        }
}

And the result still use AM / PM, like this :

enter image description here

Upvotes: 0

Views: 6344

Answers (4)

Duygu Ulu
Duygu Ulu

Reputation: 1

version for 3.9.0 in fullcalender.js inside to globalDefaults :

maxTime: "24:00:00",
slotLabelFormat: ['H:mm'],

Upvotes: 0

Mohamed Wardan
Mohamed Wardan

Reputation: 116

Change this :

timeFormat: 'H(:mm)',

by :

slotLabelFormat:"HH:mm",

Upvotes: 0

Aep Saepudin
Aep Saepudin

Reputation: 111

SOLUTION: Just add views option like this :

views: {
  timelineDay: {
    slotLabelFormat: ['H:mm'],
  },
  timelineMonth: {
    slotLabelFormat: ['DD'],
  },
},

Upvotes: 6

H77
H77

Reputation: 5967

Try slotLabelFormat.

e.g.

slotLabelFormat: ['H:mm']

Upvotes: 3

Related Questions