FullCalendar - Event spanning all day are one day too short

问题

I'm passing to fullcalendar an event like this one:

{
     id: 31,
     title: 'Test',
     start: '2014-12-22',
     end: '2014-12-23',
     allDay: true
}

I expected to find in the calendar an event that spans two whole days, but the event is only in the 2014-12-22 slot, not in the 2014-12-23 one. The nextDayThreshold parameter is set to 00:00:00, but according to the documentation it should be ignored when allDay is set to true. I'm sure that allDay is correctly interpreted because in the agenda view the event appears in the all-day row.

How can I set fullcalendar to display such an event in both days?

回答1:

I believe this a conscious design decision, in that all end dates are to be regarded as exclusive, based on discussions like this and this, i.e. so despite being an all day event, your end date is not regarded as included (inclusive) of the dates tagged. e.g. If you have a start date of 2015-03-01 00:00:00 and an end date of 2015-03-02 00:00:00 the span is only one day.

This seems to coincide with the version 2 upgrade to using moment.js. So it would appear you will either need to add '23:59:59' to your end date, or to find a a different way of specifying the end date, e.g. as a duration of two days added to the start date?

回答2:

Based on the eventDataTransform function you could add 1 day if your event is allDay. Note that this will only affect rendering.

eventDataTransform: function(event) {                                                                                                                                
  if(event.allDay) {                                                                                                                                               
    event.end = moment(event.end).add(1, 'days')                                                                                                                 
  }
  return event;  
}

来源：https://stackoverflow.com/questions/27604359/fullcalendar-event-spanning-all-day-are-one-day-too-short

标签

javascript

jquery

fullcalendar