Question

I have basically done:

$(document).ready(function() {

    $('#calendar').fullCalendar({
        defaultView: 'agendaWeek',
        firstDay:1,
        allDaySlot:false,
        axisFormat: 'h(:mm)tt',
        slotMinutes: 15,
        defaultEventMinutes:45,

so my left side shows times in 15 minute slots.

The problem is, ive set an event to run from 10:00am to 10:45 and it shows the event, but it appears the event ends at 10:30.

I’ve added a screenshot, the event on the left side is set in json like:

array(
        'id' => 333,
        'title' => "John",
        'start' => "May 5 2011 10:00:00",
        'end' => "May 5 2011 10:45:00",
        'url' => "http://yahoo.com/",
        'allDay'=> false,
        'color' => 'red',   // an option!
        'textColor'=> 'black' // an option!
    ),

and if you look on the screenshot,

i’ve added a light blue background where I think the event should end, on the 10:45 slot. Any suggestions?

Answer 1

I think you are reading it wrong. If you notice, your event covers three slots (10, 10:15:, and 10:30). It ends where the 10:45 slot starts. If you had a new event that bumped up agains your first event, you would want it to start at 10:45. Therefore, it would take up the 10:45 slot just like your first take takes up the 10 slot because it started at 10.