Is it possible to color grid cells based on day of week?

Scheduler Javascript
#1

For my scale I use

scheduler.templates.timeline_scalex_class = function(date){ if (date.getDay()==0 || date.getDay()==6) { return "weekend"; } else { return "date_class"; } };

For the grid, I use. I tried above, but get error saying:

My current code reads:

scheduler.templates.timeline_cell_class = function(date){ return "cell_class"; };

#2

Hi,
“timeline_cell_class” template receives 3 arguments (evs, date, section).
docs.dhtmlx.com/scheduler/api__s … plate.html
If these is no events in the cell, the first argument is undefined.

#3

Hi Guys

If anyone else is wondering, I solved it with some JS and CSS:

My HTML contains a link element with an id:

 <link rel='stylesheet' type='text/css' href='placeholder.css' id="grid_css">

The following JavaScript sets the css based on the day of week

[code]

<script type="text/javascript">
    function switchStyle() {
       // generates day-specific style sheet name (e.g. SG360Day1.css)
       // and replaces placeholder in link whose id is "grid_css"
        var styleElement = document.getElementById("grid_css");
        var date = new Date();
        var dayNo = date.getDay();
        var newStyleString = "SG360Day" + dayNo.toString() + ".css";
        styleElement.href = newStyleString;
        //alert("Style: " + newStyleString);
    };

    switchStyle();
</script>[/code]

The CSS files look like this (the variables @weekday and @weekend are defined in the imported .less file - if you don’t want to use less, replace the variables with a valid color). The example below is for day 0 (Sunday)

@import "SG360GridColors"; 

.cell_class:nth-child(7n-6) {
      background-color: @weekend !important;
      }

.cell_class:nth-child(7n-5) {
      background-color: @weekday !important;
      }

.cell_class:nth-child(7n-4) {
      background-color: @weekday !important;
      }

.cell_class:nth-child(7n-3) {
      background-color: @weekday !important;
      }

.cell_class:nth-child(7n-2) {
      background-color: @weekday !important;
      }

.cell_class:nth-child(7n-1) {
      background-color: @weekday !important;
      }

.cell_class:nth-child(7n) {
      background-color: @weekend !important;
      }

This colors the 1st and 7th elements the color defined in @weekend and the rest, the color defined in @weekday. (Using 7n-x was the only way I could get colors to cycle after 7 days. Not sure if there’s an easier way, but it works for me.)

Hope this helps

Regards

Mark