<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.3.2/fullcalendar.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.3/moment.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.3.2/fullcalendar.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.3.2/scheduler.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<h1>Adding events from source!</h1>
<div id='calendar'></div>
</body>
</html>
// Code goes here
$(document).ready(function() {
// page is now ready, initialize the calendar...
var mySource1 = [{
title : 'Source 1',
start : moment(),
allDay: false,
id: 1,
description: 'my event 1'
}];
var mySource2 = [{
title : 'Source 2',
start : moment().add(1, 'days'),
allDay: false,
id: 2,
description: 'my event from 2'
}];
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
allDayDefault: false,
selectable: true,
selectHelper: true,
editable: true,
eventLimit: true, // allow "more" link when too many events
eventSources:[mySource1, mySource2],
eventRender: function(event, element) {
console.log(event.source);
}
});
});
/* Styles go here */