CODEWITHSUNDEEP
javascriptjqueryjquery-pluginsfullcalendar
user1741485
user1741485

Reputation: 181

FullCalendar: How to recreate/reinitialize FullCalendar or batch add multiple events

I am trying to batch add new events to the calendar but failed to find a convenient method to use. So I then decided to just reinitialize the view with new events array. So I tried the following:

var events = [
    {
        title: 'Event',
        start: new Date(y, m, d, 10),
        description: 'long description',
        id: 1
    },
    {
        title: 'background',
        start: new Date(y, m, d, 11),
        end: new Date(y, m, d, 14),
        description: 'long description',
        id: 0,
        color: "#00FF00",
        textColor: "#000000",
        placeholder: true,
    }];
$('#calendar').fullCalendar({
    events: events
});
$('#calendar').fullCalendar();

I can still see those events, meaning that the second initialization call does not actually work. Is there any work around in this case?

Upvotes: 4

Views: 14014

Answers (3)

Neelima Ediga
Neelima Ediga

Reputation: 356

var events = [];

Filled these events in my ajax call..

.map(JSON.parse(data),
    function(r) {
        events.push({
        id: r.id,
        title: r.title,
        desc: r.desc,
        allDay: true,
        start: moment(r.start).utc(),
        end: moment(r.end).utc()    }); });

then used it to render on the calendar..

var myCalendar = $('#calendar').fullCalendar('getCalendar'); 
myCalendar.refresh = function() 
{    myCalendar.removeEvents();    
     myCalendar.addEventSource(events); 
};
    
myCalendar.refresh();

Upvotes: 1

Tomanow
Tomanow

Reputation: 7367

You can use addEventSource() like so:

.fullCalendar( 'addEventSource', events )

Source may be an Array/URL/Function just as in the events option. Events will be immediately fetched from this source and placed on the calendar

Upvotes: 4

user1741485
user1741485

Reputation: 181

Just found a walkaround.. You could do

$('#calendar').fullCalendar({
    events: events
});
$('#calendar').fullCalendar('destroy');
$('#calendar').fullCalendar();

to destroy it and then recreate.

But still, I do not know how to batch-add events.

Upvotes: 5

Related Questions