Fullcalendar slotMinutes won't work

Question

I want to display slotMinutes of 15 for my calendar. But it\'s not working. It works well on this Fiddle

$(document).ready(function() {

  var calendar = $(         


        

Answer 1

Please find this code in fullcalendar.js

(h && i ? "" : "<span>" + r(n.format(this.axisFormat)) + "<\/span>")

Replace with

(h && i ? "<span>"+i+"</span>" : "<span>" + r(n.format(this.axisFormat)) + "<\/span>")

Answer 2

You are comparing a fiddle of v1 with your v2 fiddle.

In v2 there isn't slotMinutes. Instead you should use slotDuration (see the docs), that should be set to:

slotDuration: '00:15:00'

Here is the updated jsfiddle.

EDIT: Add description for each timeslot in vertical axis

The previous fiddle shows the 15 minute slot, but the vertical axis only has the hour (like 6am, 7am, and so on).

If you want the vertical axis to have all the time slots (6am, 6:15am, 6:30am, 6:45am), you can check the source code of fullcalendar.js line 5780 (version 2.1.1) where there is a function called slatRowHtml.

In this function, the following condition is used to write the time: !slotNormal || !minutes, where:

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

So, slotNormal is always be true (we have set 15 minutes period) and minutes will be 0, 15, 30 and 45. Since the condition is negative (!slotNormal || !minutes), this means that !slotNormal is always false and !minutes is only true when minutes = 0, and this is why only the hours are displayed.

To fix this you have two options, each one with its quirks:

1. Set slotNormal = '00:15:01'. With this value slotNormal will be false and all slots will have a description. The issue with this is that you are adding a second to each timeslot, which means that, by the time fullcalendar is printing 3pm, it will be 3:01pm because of the added seconds. You can check this JSFiddle.
2. Remove the entire condition from the source code and mantain slotDuration = '00:15:00'. This will work but you need to remember to check for the condition each time you update FullCalendar,