I've some events that i load from a database. All events are intializied with dow : ' ', since i don't want the events to recur on a specific day unless told so. My events are defined from external events which data are sent to the database when dragged onto the calendar.
if($(this).text() == 'event1') {
$(this).data('event', {
title: $.trim($(this).text()),
stick: true,
start : '2016-12-01T12:00:00',
allday : false,
dow : ''
...
So if the user wants an event to recur on monday for example, the user presses a checkbox for monday and then click on the event, the eventClick fires and change the dow attribute to dow : [0].
eventClick: function(event, jsEvent, view) {
console.log("attempting click");
if ($('#day1').is(':checked')) { // day1 is a checkbox for monday
event.dow = [0];
...
This doesn't make the event copy itself on the following mondays when all events are rerendered. 'dow' only seems to work if you set it when you intially define an event or am I wrong? Is there a way to dynamically define .dow for a given event after it has been created and make the calendar copy that event?
Try this:
$('#calendar').fullCalendar({
weekends: true,
defaultView: 'agendaWeek',
allDaySlot: false,
header: {
left: 'month,agendaWeek,agendaDay,listDay',
center: 'title',
right: 'prev,next today'
},
events: [{
id: 999,
title: 'event1',
start: '2016-12-05T16:00:00',
end: '2016-12-05T18:00:00'
}],
height: 'auto',
editable: true,
eventClick: function(event, jsEvent, view) {
var updatedEvent = {
id: 999,
title: 'updated event1',
start: '16:00:00',
end: '18:00:00',
dow: [0]
};
$('#calendar').fullCalendar('removeEvents', event._id);
$('#calendar').fullCalendar('renderEvent', updatedEvent, true );
}
});