Reputation: 126
Im using the amazing FullCalendar JQuery plugin and need to display a Google Calendar Events aswell as my own custom events. Code Below.
$('#calendar').fullCalendar({
theme: true,
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
editable: true,
events: 'http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic',
events: [
{
title: 'All Day Event',
start: new Date(y, m, 1)
},
{
title: 'Long Event',
start: new Date(y, m, d-5),
end: new Date(y, m, d-2)
},
{
id: 999,
title: 'Repeating Event',
start: new Date(y, m, d-3, 16, 0),
allDay: false
},
{
id: 999,
title: 'Repeating Event',
start: new Date(y, m, d+4, 16, 0),
allDay: false
}
]
});
});
Now Im aware that I cannot have two events
attributes, but i need the data from both sources displayed. How can i go about this?
Thanks in advance, Grant
Upvotes: 0
Views: 1286
Reputation: 126
Thanks for Reading, but I've found the solution. All I had to do was Add an event source after initializing my Calendar. Code below.
$(document).ready(function() {
var date = new Date(); var d = date.getDate(); var m = date.getMonth(); var y = date.getFullYear(); $('#calendar').fullCalendar({ theme: true, header: { left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, editable: true, events: [ { title: 'All Day Event', start: new Date(y, m, 1) }, { title: 'Long Event', start: new Date(y, m, d-5), end: new Date(y, m, d-2) }, { id: 999, title: 'Repeating Event', start: new Date(y, m, d-3, 16, 0), allDay: false }, { id: 999, title: 'Repeating Event', start: new Date(y, m, d+4, 16, 0), allDay: false } ] }); $('#calendar').fullCalendar('addEventSource', 'http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic'); });
Upvotes: 4