4

I have been working on a web application that requires a calendar that will display events along with information about them. I have been using the full calendar API to handle the calendar for me. But I whenever I have an event that spans across multiple days the calendar does not render the event on each day. It will only show the event on the first day and then again on the next sunday, which does not make sense to me. I know the full calendar supports this because I saw an example of it on their site but I do not know what I am doing wrong.

This is how I am initializing the calendar and inserting events

$(document).ready(function(){
  //initialize calendar
  $('#calendar').fullCalendar({
    //options and callbacks
    // your event source
    eventSources: [
      {
        events: [ // put the array in the `events` property
            {
                title  : 'event1',
                start  : '2016-01-15T23:59',
                end    : '2016-01-21T00:01',
                isMultipleDay: true
            }
        ],
        color: 'blue',     // an option!
        textColor: 'yellow', // an option!
        nextDayThreshold: "00:01"
      }
      // any other event sources...
    ]
  });
});

jkris
  • 5,851
  • 1
  • 22
  • 30
Ben
  • 41
  • 4

2 Answers2

0

In the examples they game they omitted the timezone data.

Try the following:

events: [{
 title  : 'event1',
 start  : '2016-01-15',
 end    : '2016-01-21',
}]
jkris
  • 5,851
  • 1
  • 22
  • 30
0

So I figured out that one of the css files provided by the full calendar api was not correct, I'm not sure if I was referencing the wrong file or if the file given to me had a problem with it. But I just used the same files as the working example had and it just about worked.

The timezone data is still necessary though because the end date is exclusive, so without a Time the event will fall one day short. So this code does work.

events: [{
   title  : 'event1',
   start  : '2016-01-15',
   end    : '2016-01-21T23:59:59'
}]
Ben
  • 41
  • 4