How to update events url when clicking next, previous and today button?

Question

I have a question about fullcalendar v5.3.2 and its options.

I have following set up.

  var calendarEl = document.getElementById('calendar');                                                                                                                                                           
  var calendar = new FullCalendar.Calendar(calendarEl, {                                                                                                                                                          
    initialView: 'dayGridMonth',                                                                                                                                                                                  
    locale: 'ja',                                                                                                                                                                                                 
    themeSystem: 'bootstrap4',                                                                                                                                                                                    
    height: 700,                                                                                                                                                                                                  
    events: '/api/user/calendar/'+<?= $user->id?>+'<?= date("/Y/m")?>',                                                                                                                                           
});

I am trying to change events url and refresh the calendar when clicking the next,previous and today button. This is because I want to fetch events monthly.

Is that possible to do it?

Best regards,

Answer 1

I could set events url like following.

calendar.setOption('events', 'MY_NEW_URL');  

The full source code is as following.

  var btn = document.getElementsByClassName('fc-button-primary');                                                                                                                                                 
  for(let i = 0; i < btn.length; i++) {                                                                                                                                                                           
    btn[i].addEventListener("click", function() {                                                                                                                                                                 
      var selectedYear = document.getElementsByClassName('fc-toolbar-title')[0].textContent.match(/^[0-9]*/)[0];                                                                                                  
      if(currentYear != selectedYear)                                                                                                                                                                             
      {                                                                                                                                                                                                           
        currentYear = selectedYear;                                                                                                                                                                               
        calendar.setOption('events', '/api/user/calendar/'+<?= $user->id?>+'/'+currentYear+'/'+document.getElementsByClassName('fc-toolbar-title')[0].textContent.match(/^[0-9]*/)[1] );                                }                                                                                                                                                                                                           
    })                                                                                                                                                                                                            
  }