0

I have a web with fullcalendar and i want to take the events from the database i have (firebase) and put it in the calendar.

Fullcalendar has a property called event that needs an array and i call a function.

function agafarEventsBDD() {
var arrayEvents = [];
db.collection("calendari").get()
.then(function(querySnapshot) {
    querySnapshot.forEach(function(doc) {
        arrayEvents.push({
            title: doc.data().title,
            start: doc.data().start,
            end: doc.data().end
        });
    });
})
.catch(function(error) {
    console.log("Error getting documents: ", error);
});
console.log(arrayEvents);
return arrayEvents;

I think the problem its not how i take the array from the database cause this is the output of the console.log

[]
0: {title: "Prova", start: "2021-02-04", end: "2021-02-04"}
1: {title: "Prova", start: "2021-02-07", end: "2021-02-07"}
2: {title: "Prova", start: "2021-02-02", end: "2021-02-02"}
3: {title: "Prova", start: "2021-02-16", end: "2021-02-16"}
4: {title: "Prova", start: "2021-02-19", end: "2021-02-19"}
length: 5

The console gives no errors and any event is displayed in the calendar.

The calendar init

 var calendar = new FullCalendar.Calendar(calendarEl, {
    headerToolbar: {
        left: 'prev,next today',
        center: 'title',
        right: 'dayGridMonth,timeGridWeek,listMonth',
        lang: 'ca'
    },
    themeSystem: 'standard',
    locale: initialLocaleCode,
    timeZone: 'Europe/Madrid',
    selectable: true,
    editable: false,
    droppable: true,
    event: agafarEventsBDD(),

})
calendar.render();
farranchini
  • 3
  • 4
  • 1
    This looks like an async disconnect. see: [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) – pilchard Feb 19 '21 at 11:18
  • Also, `event:` needs to be `events:` – ADyson Feb 19 '21 at 19:52
  • Anyway if you want to use function to fetch events, please read https://fullcalendar.io/docs/events-function and rewrite your code accordingly to use the provided callbacks. this allows you to receive the events asynchronously and still pass them back to fullCalendar – ADyson Feb 19 '21 at 19:53

0 Answers0