Is there a way to set the background color of the header of the current date in Week view to a different color in order to highlight it apart from the other days of the week?
You can use templates to do that:
.dhx_cal_event.current_event div{
background-color:purple !important;
color:white !important;
}
…
scheduler.templates.event_class=function(start,end,event){
if(scheduler._mode == “week”){
var current_date = new Date();
if ((current_date>scheduler.date.add(start,-1,“day”))&&(current_date<scheduler.date.add(start,1,“day”))) //if date in past
return “current_event”; //then set special css class for it
}
}
Please, see the dhtmlxScheduler/samples/02_customization/06_templates.html sample in the scheduler package.
I have that code in place now but I am seeing nothing happening.
I just want to highlight the current day header in the Week view. I even switched to using this:
scheduler.templates.week_date_class = function(start, end, event) {
if (scheduler._mode == “week”) {
var current_date = new Date();
if ((current_date > scheduler.date.add(start, -1, “day”)) && (current_date < scheduler.date.add(start, 1, “day”))) //if date in past
return “current_event”; //then set special css class for it
}
}
As that seems to be what goes through the days of the week headers in Week view but I cannot get the current date header to highlight.
There is the week_scale_date template that allows to set template for the headers in week view:
var format = scheduler.date.date_to_str("%D, %F %j");
var today = scheduler.date.date_part(new Date());
scheduler.templates.week_scale_date = function(date){
if(date.valueOf() == today.valueOf()) return “
return format(date);
}
Ah! That got it!
Many thanks, Alex!
How to do this in timeline cell view?
thanks
Hello,
You can use timeline_cell_class template, where timeline is the name of your view:
scheduler.templates.timeline_cell_class = function(evs, date, section){
// evs - list of events which will be displayed in this cell
// date - date for which cell is displayed
// section - object with section's properties(e.g. section.key, section.label)
return ""; // css class which will be assigned
}
Best regards,
Ilya