Geek Answers Handbook

Fullcalendar slotMinutes will not work

I want to display slotMinutes of 15 for my calendar. But that does not work. It works great on this script

$(document).ready(function() { var calendar = $('#calendar').fullCalendar({ defaultView: 'agendaWeek', editable: true, slotMinutes: 15, selectable: true, //header and other values select: function(start, end, allDay) { endtime = $.fullCalendar.formatDate(end,'h:mm tt'); starttime = $.fullCalendar.formatDate(start,'ddd, MMM d, h:mm tt'); var mywhen = starttime + ' - ' + endtime; $('#createEventModal #apptStartTime').val(start); $('#createEventModal #apptEndTime').val(end); $('#createEventModal #apptAllDay').val(allDay); $('#createEventModal #when').text(mywhen); $('#createEventModal').modal('show'); } });

To access the script, click http://jsfiddle.net/mccannf/AzmJv/16/ ... However, it will not work for mine , what am I doing wrong?

+2
source share
2 answers

You are comparing v1 script with your v2 script.

There is no slotMinutes in v2. Instead, you should use slotDuration ( see Docs ), which should be set:

 slotDuration: '00:15:00'

Here is the updated jsfiddle .

EDIT: Add a description for each time interval along the vertical axis

The previous violin shows a 15-minute interval, but the vertical axis has only an hour (for example, 6am, 7am, etc.).

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

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

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

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

To fix this, you have two options, each of which has its own characteristics:

  • Set slotNormal = '00:15:01' . In this case, the value of slotNormal will be false, and all slots will have a description. The problem is that you are adding a second to each time interval, which means that by the time fullcalendar prints 3pm , it will be 3:01pm due to the added seconds. You can check out this JSFiddle .
  • Remove the entire condition from the source code and mantain slotDuration = '00:15:00' . This will work, but you should keep this in mind every time you upgrade FullCalendar,
+14
source

This code is in fullcalendar.js

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

Replace

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

More articles:


All Articles