While using FullCalendar to display dates, I noticed a discrepancy where some dates appear correctly while others do not. The issue seems to be related to events with a start time of 8pm or later.
For example, on August 17th, there are two events scheduled, but only one is displayed correctly on the calendar.
Here is the event data for the two events:
[Event 1]
- Title: Rise of the Runelords, a Pathfinder Adventure Path
- Start Time: August 17th, 00:15
- End Time: August 17th, 03:15
- Location: Roll20 and Discord
- Budget Amount: $10
- More details...
[Event 2]
- Title: Monday Night Age of Worms
- Start Time: August 17th, 23:00
- End Time: August 18th, 02:00
- Location: Foundry
- Budget Amount: $0
- More details...
Below is the event code I am using to render these events on the calendar:
document.addEventListener('DOMContentLoaded', function() {
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
height: 560,
plugins: [ 'interaction', 'dayGrid', 'timeGrid' ],
defaultView: 'dayGridMonth',
defaultDate: '{% now "Y-m-d" %}',
// Event Render Function...
// Header Configuration...
events: [
{% for event in connected_events %}
{
title: "{{event.event_title}}",
start: "{{event.start_time|date:'c'}}",
end: "{{event.end_time|date:'c'}}",
url: "{% url 'events:event-detail' event.unique_id %}",
// Color coding based on conditions...
},
{% endfor %}
],
});
calendar.render();
});