javascript - Change Format Time AMPM to 24 hour Timeline Day fullcalendar - Stack Overflow

admin管理员组

文章数量:1303640

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

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

• javascript
• jquery
• fullcalendar
• fullcalendar-scheduler

Share Improve this question Follow edited Feb 22, 2018 at 5:20 Jon P 19.8k88 gold badges5151 silver badges7676 bronze badges asked Feb 22, 2018 at 2:58 Aep SaepudinAep Saepudin 11111 silver badge77 bronze badges 1

• 1 If an answer below has solved your question, please accept it by clicking the green arrow. If not, feel free to create your own answer to your question. Your question, however, should not also contain your resolution. – K.Dᴀᴠɪs Commented Feb 22, 2018 at 5:03

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 6

SOLUTION: Just add views option like this :

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

Try slotLabelFormat.

e.g.

slotLabelFormat: ['H:mm']

Change this :

timeFormat: 'H(:mm)',

by :

slotLabelFormat:"HH:mm",

version for 3.9.0 in fullcalender.js inside to globalDefaults :

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

本文标签： javascriptChange Format Time AMPM to 24 hour Timeline Day fullcalendarStack Overflow