CODEWITHSUNDEEP
ajaxfullcalendar
Flaviu Jurcan
Flaviu Jurcan

Reputation: 105

Fullcalendar minTime ajax

I'm trying to change the minTime in fullcalendar according to the database schedule through an ajax request on the viewRender, but it goes into a loop.

Part of my calendarOptions:

var calendarOptions = {
    header: {
        left: ' today',
        center: 'prev,title,next',
        right: 'agendaWeek,resourceDay'
    },
    defaultView: 'resourceDay',

The viewRender:

viewRender: function(view, element){
        var curDate = ($('#calendar').fullCalendar('getDate')).format('d-DD-MM').split('-');
        var curWeekDay = curDate[0];
        var curMonthDay = curDate[1];
        var curMonth = curDate[2];

        $.ajax({
            url: 'calendar/getBusinessHours',
            type: 'GET',
            data: {
                'day': curWeekDay,
                "_token": $('body').find( 'input[name=_token]' ).val()
            },
            success: function (response) {
                $('#calendar').fullCalendar("destroy");
                $("#calendar").fullCalendar(
                    $.extend(calendarOptions, {
                        defaultDate: currentDate,
                        minTime: response[0].open_time+':00',
                        maxTime: response[0].close_time+':00'
                    })
                );
            }
        });
    },

The ajax response is '08:00:00' so there is no problem there;

Upvotes: 0

Views: 351

Answers (1)

Ivan Dimov
Ivan Dimov

Reputation: 956

I have not tested this but I believe your problem comes from destroying fullCalendar and setting it up again. Essentially, what happens is that your calendar loads and the view is rendered, then you make an ajax request, destroy the calendar, create a new one which triggers viewRender again and so on. 

success: function (response) {
            $('#calendar').fullCalendar("destroy");
            $("#calendar").fullCalendar(...

You can either load the minTime and maxTime before initializing the calendar (getting the values from the database with an ajax call and initializing the calendar only when the values are retrieved from the back-end so you can pass them to the initialization as options) or change their values inside a different event (not viewRender)

What you can also do is add a variable to the equation and launch the AJAX conditionally - if the calendar is not in a process of reconstructing itself with the new minTime and maxTime.

Upvotes: 1

Related Questions