24-часовой формат времени (так нет AM для PM) для fullCalendar

Я пытаюсь отобразить 24-часовой формат времени в fullCalendar, я пытаюсь использовать следующие инструкции: http://arshaw.com/fullcalendar/docs/text/timeFormat/ p >

Итак, я добавил

timeFormat: {
    agenda: 'H(:mm)' //h:mm{ - h:mm}'
    },

в json.php:

$(document).ready(function() {

    $('#calendar').fullCalendar({

    header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },

        editable: true,
        allDayDefault: false,
        events: "core/displays/calendar/json-events.php", 
        defaultView: 'agendaDay',
        timeFormat: {
    agenda: 'H(:mm)' //h:mm{ - h:mm}'
    },


        eventDrop: function(event, delta) {
            alert(event.title + ' was moved ' + delta + ' days\n' +
                '(should probably update your database)');
        },
                eventClick: function(calEvent, jsEvent, view) {     

               window.location = "details_view.php?id=" + calEvent.id;


    },

        loading: function(bool) {
            if (bool) $('#loading').show();
            else $('#loading').hide();
        }


    });

});

но это не сработало, поэтому я добавил в fullCalendar.js

// time formats
titleFormat: {
    month: 'MMMM yyyy',
    week: "MMM d[ yyyy]{ '—'[ MMM] d yyyy}",
    day: 'dddd, MMM d, yyyy'
},
columnFormat: {
    month: 'ddd',
    week: 'ddd M/d',
    day: 'dddd M/d'
},
axisFormat: 'H(:mm)', //,'h(:mm)tt',
timeFormat: {
    agenda: 'H(:mm)' //h:mm{ - h:mm}'
    },
// locale

но это тоже не сработало, что я делаю неправильно?

Ответы

Ответ 1

Вы хотите установить макет на 24 часа системы или событий.

Если вы хотите добавить к событиям, поставьте как 22:00 "вечеринка", затем добавьте timeFormat: "H: mm" в ваш файл json.php.

eventDrop: function (event, delta) {
        alert(event.title + ' was moved ' + delta + ' days\n' +
            '(should probably update your database)');
},
timeFormat: 'H:mm',

Если вы хотите изменить макет вашего календаря, просто перейдите на ваш fullCalendar.js

Уважать:

SetDefaults

И измените свой код, как показано ниже.

setDefaults({
    allDaySlot: true,
    allDayText: 'Volledige dag',
    firstHour: 8,
    slotMinutes: 30,
    defaultEventMinutes: 120,
    axisFormat: 'HH:mm',
    timeFormat: {
        agenda: 'H:mm{ - h:mm}'
    },
    dragOpacity: {
        agenda: .5
    },
    minTime: 0,
    maxTime: 24
});

Ответ 3

Если вы хотите изменить представление месяца в поиске за 24 часа и изменить в fullcalendar.js это:

var dateFormatters = {
    s   : function(d)   { return d.getSeconds() },
    ss  : function(d)   { return zeroPad(d.getSeconds()) },
    m   : function(d)   { return d.getMinutes() },
    mm  : function(d)   { return zeroPad(d.getMinutes()) },
    h   : function(d)   { return d.getHours() % 24 || 24 },             //modificato : era 12 al posto di 24
    hh  : function(d)   { return zeroPad(d.getHours() % 24 || 24) },    //modificato : era 12 al posto di 24
    H   : function(d)   { return d.getHours() },
    HH  : function(d)   { return zeroPad(d.getHours()) },
    d   : function(d)   { return d.getDate() },
    dd  : function(d)   { return zeroPad(d.getDate()) },
    ddd : function(d,o) { return o.dayNamesShort[d.getDay()] },
    dddd: function(d,o) { return o.dayNames[d.getDay()] },
    M   : function(d)   { return d.getMonth() + 1 },
    MM  : function(d)   { return zeroPad(d.getMonth() + 1) },
    MMM : function(d,o) { return o.monthNamesShort[d.getMonth()] },
    MMMM: function(d,o) { return o.monthNames[d.getMonth()] },
    yy  : function(d)   { return (d.getFullYear()+'').substring(2) },
    yyyy: function(d)   { return d.getFullYear() },
    //t : function(d)   { return d.getHours() < 12 ? 'a' : 'p' },
    //tt    : function(d)   { return d.getHours() < 12 ? 'am' : 'pm' },
    //T : function(d)   { return d.getHours() < 12 ? 'A' : 'P' },
    //TT    : function(d)   { return d.getHours() < 12 ? 'AM' : 'PM' },
    t   : function(d)   { return d.getMinutes() == 0 ? ':00' : '' },
    tt  : function(d)   { return d.getHours() < 12 ? '' : '' },
    T   : function(d)   { return d.getHours() < 12 ? '' : '' },
    TT  : function(d)   { return d.getHours() < 12 ? '' : '' },
    u   : function(d)   { return formatDate(d, "yyyy-MM-dd'T'HH:mm:ss'Z'") },
    S   : function(d)   {
        var date = d.getDate();
        if (date > 10 && date < 20) {
            return 'th';
        }
        return ['st', 'nd', 'rd'][date%10-1] || 'th';
    }
};

Ответ 4

Наиболее одобренный ответ работает для более старых версий. Для более новых версий добавьте еще одну переменную в SetDefaults:

slotLabelFormat:'H(:mm)',

Это должно работать для более новых версий (2018), таких как FullCalendar v3.9.0

Ответ 5

Если вы используете fullCalendar v1, попробуйте добавить их:

$('#calendar').fullCalendar({
     [...]// some code,

     axisFormat: 'H:mm',
     timeFormat: {
          agenda: 'H:mm{ - H:mm}'
     }
});

Ответ 6

По какой-то причине эти решения больше не работали для меня.

Итак, после некоторого обширного (cmd + F) поиска я нашел этот пост, говорящий о /includes/js/main.js вокруг строки 107. Линия 107 позволяет вам изменить порядок дня/месяца/года.

Но тогда! Строка 113 (или вокруг) позволяет вам изменить am/pm, в режиме дня и дня, в представление времени, которое используется во всем мире (кроме некоторых англоязычных стран).

Вы можете изменить больше, если хотите, но ниже вы найдете код фрагмента, который был бы достаточно хорош для того, чтобы он правильно показывался на голландском веб-сайте.

TT:function(a){return a.getHours()<12?"AM":"PM"},u:function(a){return Oa(a,"yyyy-MM-dd'T'HH:mm:ss'Z'")},S:function(a){a=a.getDate();if(a>10&&a<20)return"th";return["st","nd","rd"][a%10-1]||"th"}};Aa.applyAll=$a;Ja.month=mc;Ja.basicWeek=nc;Ja.basicDay=oc;wb({weekMode:"fixed"});Ja.agendaWeek=qc;Ja.agendaDay=rc;wb({allDaySlot:true,allDayText:"hele dag",firstHour:8,slotMinutes:30,defaultEventMinutes:120,axisFormat:"HH:mm",timeFormat:{agenda:"h:mm{ - h:mm}"},dragOpacity:{agenda:0.5},minTime:0, maxTime:22})}) И для вашего удобства вы найдете здесь весь main.js, установленный для голландского: http://pastebin.com/HYGHRebZ

Я надеюсь, что это решение будет работать и для вас!

Ответ 7

используйте это для v.2 plus timeFormat: 'H(:mm)',

Ответ 8

axisFormat: 'H:mm',
timeFormat: {
    agenda: 'H:mm'
},

он работает как в режиме agendaDay и в формате 24 часа.

Ответ 9

Начиная с версии fullCalendar.io версии 4, в зависимости от того, где вы хотите изменить формат, используйте eventTimeFormat, titleFormat, columnHeaderFormat или slotLabelFormat (последний для оси в временных сетках) в следующей форме:

eventTimeFormat: {
  hour: '2-digit', //2-digit, numeric
  minute: '2-digit', //2-digit, numeric
  second: '2-digit', //2-digit, numeric
  meridiem: false, //lowercase, short, narrow, false (display of AM/PM)
  hour12: false //true, false
}

Комментарии отображают значения параметров.

Для получения дополнительной информации: https://fullcalendar.io/docs/date-formatting

Ответ 10

Я использую версию 4.2.0, и она работала с этим в конце событий:

      {
      title: 'Birthday Party',
      start: '2019-06-13T07:00:00',
      eventBackgroundColor: '#ff0000',
      allDay:false
      }

  ],
  eventTimeFormat: { 
    hour: '2-digit',
    minute: '2-digit',
    hour12:false
}

});