问题:

I tried this implementation Full Calendar Implementation.

    $("#available_classes_calendar").fullCalendar({         header: {              left   : 'prev,next',              center : 'title'             },         defaultView: 'agendaWeek',         views:{             agenda:{                 allDaySlot: false,                 minTime: "06:30:00",                 maxTime: "24:00:00",                 slotDuration: "00:60:00"             }         }     });

In this all-day column should be start from 6:30am and interval slot should be 1 hour.

So all-days column should look like:

6:30 am 7:30 am 8:30 am . . . 11:30 pm

I tried lots of solution but not able to achieve this.

Please let me know if any other info is required to solve this.

Thanks

回答1:

Your issue is the place where you've put your options. It should be

$("#available_classes_calendar").fullCalendar({     header: {          left   : 'prev,next',          center : 'title'         },     defaultView: 'agendaWeek',     allDaySlot: false,     minTime: "06:30:00",     maxTime: "24:00:00",     slotDuration: "06:00:01" });

Regarding the display of 06:30, 07:30 and so on, on the vertical axis, you need to set the slotDuration: "06:30:01". Take a look at this jsfiddle.

The most important thing to notice is the 01 second on the slotDuration. Without this, you won't be able to display half hours.

Explanation as to why you need the "+01" second:

FullCalendar supports axis with half hours or whatever you want, but you need to do this quirky thing. The reason behind this is in the source code itself (view source for FullCalendar 2.3.1), from line 5714 to 5719:

((!slotNormal || !minutes) ? // if irregular slot duration, or on the hour, then display the time     '<span>' + // for matchCellWidths         htmlEscape(slotDate.format(this.axisFormat)) +     '</span>' :     ''

Now, $slotNormal is defined on line 5701 and is:

var slotNormal = this.slotDuration.asMinutes() % 15 === 0;

So, if you have a 30 minute slot time, the condition will be false and FullCalendar won't display the time. This subject is covered in depth in this answer.

One additional remark: You're using FullCalendar v1.5.4 which is really old and I advice you to upgrade. If you do upgrade, remember that FullCalendar now relies on momentjs.

回答2:

Simply pull out the options that you put inside views.

This is your modified working fiddle.

转载请标明出处:Full Calendar Time interval Should be 1 hour and start from 6:30

文章来源: Full Calendar Time interval Should be 1 hour and start from 6:30

标签

fullcalendar

interval