How to highlight the current date in week view header scale bar


#1

hi let me know how to highlight current date in week view like below.

image


#2

Hello Sravan,
in order to change the view of the header please use the week_scale_date template:
https://docs.dhtmlx.com/scheduler/api__scheduler_week_scale_date_template.html
When you click on the event you can get the event object via the onClick event and take the actual date and the number of the day:

    var weekDay;
    scheduler.attachEvent("onClick", function (id, e){
    var date = e.path[2].ariaLabel;
    var formattedDate = new Date(date);
    weekDay = takeWeekDayNumber(formattedDate);
    scheduler.updateView();
    return true;
    });

After you get the actual date, you can change the header of the column via week_scale_date:

scheduler.templates.week_scale_date = function(date){  
var thisDay = takeWeekDayNumber(date);
if (weekDay && weekDay === thisDay) {
return `<div class="wrapper"><div 
class="circle">${takeWeekDayNumber(date)}</div>${format(date)}</div>`;
} else {  
return `<div class="wrapper"><div>${takeWeekDayNumber(date)} 
</div>${format(date)}</div>`;
}
};

Here is a related sample:
http://snippet.dhtmlx.com/5/fa55a2c9d