Name your fiddle
Description
by slicedtoad
HTML
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.3.0/fullcalendar.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.3.0/fullcalendar.min.js "></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<div id='calendar'></div>
JavaScript
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'agendaWeek'
},
defaultDate: '2015-04-20',
editable: false,
eventLimit: true,
firstDay: 1,
defaultView: 'agendaWeek',
timeFormat: 'HH:mm',
lang: 'de',
columnFormat: 'dddd D.M.',
allDaySlot: false,
slotDuration: '00:30:00', // default is 30 min
minTime: '12:00:00',
// maxTime: '23:00:00',
contentHeight: 600,
eventResizeStop: function (event, jsEvent, ui, view) {
alert('end');
},
// * no callback
eventClick: function (calEvent, jsEvent, view) {
alert('clicked');
},
// * no callback
eventDrop: function (event, delta, revertFunc, jsEvent, ui, view) {
alert('dropped');
},
// * no callback
eventResize: function (event, delta, revertFunc, jsEvent, ui, view) {
alert(event.title + ' end is now ' + event.end.format());
},
events: [{
title: '',
start: '2014-09-01T18:00:00',
end: '2014-09-01T20:00:00',
dow: [1], // repeat same weekday
rendering: 'background',
color: '#6BA5C2'
}, {
title: '',
start: '2014-09-02T20:00:00',
end: '2014-09-02T22:00:00',
dow: [2], // repeat same weekday
rendering: 'background',
color: '#6BA5C2'
}, {
title: 'Event',
start: '2015-04-24 13:00:00',
end: '2015-04-24 14:00:00',
color: '#F77'
}, ],
// * no callback
viewDisplay: function (element) {
alert(element);
},
// adding an event
selectable: true,
selectHelper: true,
select: function (start, end) {
var title = prompt('Deine E-Mail:');
var eventData;
if (title) {
eventData = {
title: title,
start: start,
end: end,
color: '#00AA00',
editable: true,
...