7

I know how to initilize the view of FullCalendar, in particular when my page is load I do:

$('#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'm using this extension: https://github.com/mherrmann/fullcalendar-columns/issues/1 that add the resource support. Anyway, What I'm trying to do is change the columns parameter content through code. The columns property is inside the two available view multiColAgendaDay and multiColAgendaWeek. I've a method that's populate the calendar with all the appointments available, this method doesn't reload the page 'cause use an ajax request. All working fine, but I want to add in this method a redraw of the columns available, in particular inside the population method at the top of all redrawing the calendar view:

$('#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's that the calendar isn't redrawed and after this code execution the result is ever like this:

enter image description here

I don't know what I'm doing wrong, maybe the calendar can't redraw the view without a page reload? How I can fix this?

4
  • Have you tried explicitly redrawing using $('#calendar').fullCalendar('render')? Commented Oct 22, 2015 at 17:28
  • No I doesn't tried with render
    – Dillinger
    Commented Oct 22, 2015 at 20:44
  • So does render work? Commented Oct 22, 2015 at 20:58
  • For the moment I've solved setting my operators in the initialization of calendar
    – Dillinger
    Commented Oct 22, 2015 at 21:50

1 Answer 1

2

In some case render will not works. I have problem such like that so i made a separate method for this. In my case i have passed Json Array on each refresh so, i have first call the method to get array and then add this line:

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

and then create calendar instance and passed Json array to events.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.