Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Color weekend at Fullcalendar

Tags:

fullcalendar

I am using FullCalendar component and I need to color the weekends ,Friday & Saturday. I have used the following as recommended here: Can I set a different color for the weekend on monthly fullCalendar display

$('table.calendar > tbody > tr > td:nth-child(-n+2)').addClass('fc-weekend');

I added as well the css class.

Here is me code that doesn't color the weekends ... Any advise!

$(document).ready(function() {
    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();
    $.getJSON('[@spring.url '/loadSomeData'/]', function (data) {
      $.getJSON('[@spring.url '/loadOtherData/]', function (info) {
        information = returnedPublicVacation;

        var calendar = $('#calendar').fullCalendar({
          header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
          },
          selectable: true,
          selectHelper: true,
          select:
            function(start, end, allDay) {
              vacationStart = start;
              showTheCorrectDialog(vacationStart);
            },

          eventClick: function(calEvent, jsEvent, view) {

            showTheCorrectDialog(calEvent.start);

            // change the border color just for fun
            $(this).css('border-color', 'red');
          },

          editable: true,
          events:data.concat(information)
        });
        resourceVacation = data;
      });
    });

    $('table.calendar > tbody > tr > td:nth-child(-n+2)').addClass('fc-weekend');
  });
like image 525
Echo Avatar asked Dec 17 '12 16:12

Echo


1 Answers

Did you add style to the class in your css file?

You might also try this:

.fc-fri { color:blue; }
.fc-sat { color:red;  }

(or .fc-sun for Sunday) You can see the example here: http://jsfiddle.net/rajesh13yadav/nf9whojL/1/

like image 164
Viktor Avatar answered Oct 02 '22 23:10

Viktor