Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Multiple nowIndicators on fullCalendar

Since there is very little documentation of the nowIndicator ... is there a way of showing a similar element like the nowIndicator on the same page ?

For example... I want to show a green one starting at 01:00 and i want to show a blue one starting at 12:00

like image 941
Vlad N Avatar asked Feb 28 '18 13:02

Vlad N


1 Answers

I'm not sure if this is the best solution, it's more like a hack. The idea is to change the background-color to today's row. So you select all the rows because the interval of time is 30 minutes, you'll get 96 elements. (48 per day) the first 24 you don't need it because its the day before. You'll need the 25-73 elements because is today rows.

I wrote this function, that will be called on every dayRender.

function colorToday() {
  var color = '#EEEEEE';
  var fullArray = $('.fc-slats tr .fc-widget-content:nth-child(2)');
  var todayArray = fullArray.slice(24, 72);

  for(var i = 0; i < todayArray.length; i++) {
    var data = $(todayArray[i]);
    $(data).css('background', color);
  }
}

And add this to the options:

dayRender: function (element) {
   colorToday();
}

This is a JSFIDDLE Like I said, I'm not sure if this is the best solution, but it does the work. Hope will help you.

like image 151
finw3 Avatar answered Nov 01 '22 08:11

finw3