I use FullCalendar with two eventSources (same url, but different extraParams:).
As long as both eventSources have events in the actually displayed month, everything works fine.
If one of the sources laks events for the actually displayed month, so that the url return no array of events, but false, only a blank calendar with the actual date highlighted is displayed and I cannot move to another month, week, year. The events from the second url (an array of events) isn't rendered.
In the browser I get the following error: Uncaught (in promise) TypeError: e is not iterable.
Here my code:
document.addEventListener('DOMContentLoaded', function() {
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
headerToolbar: { center: 'dayGridMonth,timeGridWeek,multiMonthYear,listWeek'},
initialView: 'dayGridMonth',
themeSystem: 'bootstrap',
locale: 'de',
height: 'parent',
weekNumberCalculation: 'ISO',
buttonText: {
today: 'Heute',
month: 'Monat',
week: 'Woche',
year: 'Jahr',
list: 'Liste'
},
eventClick: function(event) {
if (event.event.url) {
event.jsEvent.preventDefault();
window.open(event.event.url, "_blank");
}
},
eventSources: [
{
url: 'https://example.com/data/get_events_json.php',
extraParams: {
region: 'S',
},
failure: function() {
alert('there was an error while fetching events!');
},
color: 'SandyBrown',
textColor: 'black',
},
{
url: 'https://example.com/data/get_events_json.php',
extraParams: {
region: 'N',
},
failure: function() {
alert('there was an error while fetching events!');
},
color: 'DarkKhaki',
textColor: 'black',
}
]
});
calendar.render();
});
You mentioned this:
If one of the sources lacks events for the actually displayed month, so that the url return no array of events, but false
This is likely to be the source of your problem. The PHP script in get_events_json.php
should return an empty array (i.e. []
when it's encoded as JSON) not false
, when there are no relevant events to return. e is not iterable
happens because you can't loop (iterate) over false
, since it's not a list of items.
If you need further help with this, show the code from get_events_json.php
.
P.S. If for any reason you cannot modify the server-side PHP code to resolve this, you would have to go down the route of having a custom events function for each event source, rather than just providing the URL. That way you could handle the case where the server returns false
, and pass an empty array to fullCalendar at that point.