IsaacK
IsaacK

Reputation: 1298

How to load new events into FullCalendar

I am using FullCalendar 3.2. The problem is if I get the current events from calender and clear then add new ones to array. When I call

$('#calendar').fullCalendar( 'updateEvents',eventsList);

It does not work but throws error

Uncaught TypeError: Cannot read property 'clone' of undefined
    at Y (fullcalendar.min.js:6)
    at Bt.x [as updateEvents] (fullcalendar.min.js:6)
    at HTMLDivElement.<anonymous> (fullcalendar.min.js:6)

This is the code inside the button click handler

var items = $('#calendar').fullCalendar( 'clientEvents');
items.splice(0, items.length);
items.push({
            title: 'All Day Event',
            start: '2017-02-01'
            });
items.push({
            title: 'Long Event',
            start: '2017-02-07',
            end: '2017-02-10'
            });
$('#calendar').fullCalendar( 'updateEvents',items);

I have tried to use jquery version 2.2.4 and 3.1.1 but no luck

<link rel="stylesheet" href="resources/css/default.css">
<link rel='stylesheet' href='resources/css/fullcalendar.css' />
<script src='resources/js/jquery-3.1.1.min.js'></script>
<script src='resources/js/moment-with-locales.min.js'></script>
<script src='resources/js/fullcalendar.js'></script>

Upvotes: 4

Views: 1703

Answers (1)

Radonirina Maminiaina
Radonirina Maminiaina

Reputation: 7004

You can try this: https://fullcalendar.io/docs1/event_rendering/renderEvent/

 $("#calendar").fullCalendar( /* option */);
 var items = [
    {
        title: 'All Day Event',
        start: '2017-02-01'
    }, {
        title: 'Long Event',
        start: '2017-02-07',
        end: '2017-02-10'
    }
];
for ( var i = 0; i < items.length; i++ ) {
    $('#calendar').fullCalendar( 'renderEvent', items[i]);
}

renderEvent : Renders a new event on the calendar.

Note: event must be an Event Object with a title and start at the very least.

Demo here

Upvotes: 1

Related Questions