Would it be possible to add background text in full calendar when there is no event found for day, need help please
e.g
Just an idea:
$('#calendar').fullCalendar({
defaultView: 'month',
events: [{
title: 'event',
start: '2017-01-05 11:00',
end: '2017-01-06 13:00',
}, {
title: 'event 2',
start: '2017-01-18'
}],
dayRender: function(date, cell) {
cell.append('<div class="unavailable">Unavailable</div>');
},
eventAfterAllRender: function(view) {
var dayEvents = $('#calendar').fullCalendar('clientEvents', function(event) {
if (event.end) {
var dates = getDates(event.start, event.end);
$.each(dates, function(index, value) {
var td = $('td.fc-day[data-date="' + value + '"]');
td.find('div:first').remove();
});
} else {
var td = $('td.fc-day[data-date="' + event.start.format('YYYY-MM-DD') + '"]');
td.find('div:first').remove();
}
});
}
});
function getDates(startDate, endDate) {
var now = startDate,
dates = [];
while (now.format('YYYY-MM-DD') <= endDate.format('YYYY-MM-DD')) {
dates.push(now.format('YYYY-MM-DD'));
now.add('days', 1);
}
return dates;
};
Try this fiddle.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With