Geek Answers Handbook

How to redraw FullCalendar?

I know how to initialize the FullCalendar view, in particular when my page loads:

$('#calendar').fullCalendar({ 'defaultView': 'multiColAgendaWeek', 'height': BackendCalendar.getCalendarHeight(), 'editable': true, 'firstDay': 1, // Monday 'slotMinutes': 30, 'snapMinutes': 15, 'axisFormat': 'HH:mm', 'timeFormat': 'HH:mm{ - HH:mm}', 'allDayText': EALang['all_day'], 'columnFormat': { 'month': 'ddd', 'week': 'ddd D', 'day': 'dddd' }, 'titleFormat': { 'month': 'MMMM YYYY', 'week': "MMM D YYYY", 'day': 'MMMM D YYYY' }, 'header': { 'left': 'prev,next today', 'center': 'title', 'right': 'multiColAgendaDay,multiColAgendaWeek,month' }, 'views': { 'multiColAgendaDay': { 'type': 'multiColAgenda', 'duration': { days: 1}, 'columns': [ { id:1, name: 'Op1' }, { id:2, name: 'Op2' } ] }, 'multiColAgendaWeek': { 'type': 'multiColAgenda', 'duration': { weeks: 1 }, 'columns': [ { id: 1, name: 'Op1' }, { id: 2, name: 'Op2' } ] } },

I use this extension: https://github.com/mherrmann/fullcalendar-columns/issues/1 that add resource support. Anyway, what I'm trying to do is change the contents of the column parameters using code. The columns property is inside the two available views multiColAgendaDay and multiColAgendaWeek . I have a method that fills the calendar with all available appointments, this method does not reload the page because it uses an ajax request. Everything works fine, but I want to add to this method a redraw of the available columns, in particular inside the population method, at the top of the entire redraw of the calendar:

 $('#calendar').fullCalendar({ views: { 'multiColAgendaDay': { 'type': 'multiColAgenda', 'duration': { days: 1 }, 'columns': [ { id: 1, name: 'First Column' }, { id: 2, name: 'Second Column' } ] } }, 'multiColAgendaWeek': { 'type': 'multiColAgenda', 'duration': { weeks: 1 }, 'columns': [ { id: 1, name: 'First Column' }, { id: 2, name: 'Second Column' } ] } });

The problem is that the calendar does not redraw, and after executing this code, the result will be like this:

enter image description here

I don’t know what I am doing wrong, maybe the calendar cannot redraw the view without reloading the page? How can i fix this?

+6
source share
1 answer

In some cases, the render will not work. I have such a problem, so I made a separate method for this. In my case, I went through a Json Array with each update, so I first call the method to get the array, and then add the following line:

 $("#calendar").fullCalendar('destroy');

and then instantiate the calendar and pass the Json array to the events.

+1
source

More articles:


All Articles