How to disable dates before current date?

I Want to know how to disable all dates before current date in scheduler … on_options

Try to use

scheduler.config.limit_end = new Date();

its not working. i want it to be from the current date so that the days before like yesterday are not accesible. they should not be displayed in the scheduler

try .limit_view property, … on_options

scheduler.config.limit_start = new Date(); scheduler.config.limit_end = new Date(9999,0,1); scheduler.config.limit_view = true;

thanx it wrks perfectly.


Is there any option to color the past days in gray color (or light color) which indicates that those days are disabled?

Hi @Uthpala_Pitawela,
if I understand correctly what you mean by past days , you want to color all days before the current day in gray.
In order for doing this, please follow the general steps:

  1. Firstly, please add dhtmlxscheduler_limit.js extension to your app. When onBeforeViewChange event fires, please get the start date of the current view:
    var viewStartDate =[mode + "_start"](new Date(date));
    if(mode == "month")
    viewStartDate =;                
    return true;
  1. Then using addMarkedTimespan set the period of time to be disabled:
    markedTimespan = scheduler.addMarkedTimespan({
      start_date: viewStartDate,
      end_date: new Date(),
      zones: "fullday",
      type: "dhx_time_block"
  1. Please, use the additional code to color days in the month view via month_date_class template
scheduler.templates.month_date_class = function(date){
  if (date < new Date()){
    return "gray_section";
  } else {
    return "";

and add the CSS style:

.gray_section .dhx_month_head {
background-color: silver;
opacity: .4;
z-index: 1;
gray_section .dhx_month_body {
background-color: silver;
opacity: .4;
z-index: 1;

Please, see the implementation in the demo:

1 Like