I use django with fullcalendar and I want to change the color of days based of user's schedule.
here is the structure of the user's schedule:
Sunday: off // e.g. color should be blue
Monday: work // e.g. color should be pink
Tuesday: home // e.g. color should be yellow
...
I want to change all Sunday's
color to blue and so on.
here is my code:
$('#calendar').fullCalendar({
header: {
left: 'prev',
center: 'title',
right: 'next'
},
defaultView: 'month',
eventLimit: true,
events: [
{% for event in events %}
{
title: "{{ event.title }}",
date: '{{ event.date|date:"Y-m-d" }}',
time: '{{ event.time }}',
display: 'background'
},
{% endfor %}
],
});
I am not sure how optimize is my answer, but I implement it like this:
dayRender: function(date, cell) {
day = moment(date).format('ddd');
if (day == 'Sat') {
cell.css("background-color", "red");
} else if (day == 'Sun') {
cell.css("background-color", "orange");
} else if (day == 'Mon') {
cell.css("background-color", "green");
} else if (day == 'Tue') {
cell.css("background-color", "blue");
} else if (day == 'Wed') {
cell.css("background-color", "yellow");
} else if (day == 'Thu') {
cell.css("background-color", "purple");
} else {
cell.css("background-color", "pink");
}
}
here is the result of code: