Disable un-active dates

[Atish Kumar]

I am using room scheduler and I wanted to disable other dates excluding the active week dates from navigation calender. how it would be possible. please suggest. I am giving the external week to start the calendar. and wanted to disable all dates excluding that week dates. and for that week only calendar will perform. we will want to handle the TimelineDay, TimeineWeek, Week view for that specific week only. 

and it would be more helpful if you suggest me how to disable the next and prev navigation buttons.

PFA.

Thanks in Advance

Atish

Attachment: disable_dates_883047af.zip

[Nevitha Ravi]

Hi Atish, 

Greetings from Syncfusion Support. 

We have prepared a sample to disable the week dates other the current week using minDate and maxDate property for your reference which can be viewed from the following link. 

https://stackblitz.com/edit/schedule-min-max-date?file=index.ts 

 

UG: https://ej2.syncfusion.com/documentation/schedule/cell-customization/#customizing-the-minimum-and-maximum-date-values  

Please try the above solution and get back to us if you need any further assistance. 

Regards, 

Nevitha 

[Nevitha Ravi]

Hi Atish, 

Thanks for your update. 

The minDate and maxDate property helps you to disable the dates before the date provide in minDate and after the dates provided in maxDate property. We don’t have to handle any CSS in sample end to disable the dates. 

let scheduleOptions: ScheduleModel = { 

   

  minDate: new Date(2018, 3, 8), 

  maxDate: new Date(2018, 3, 14), 

} 

 

Please get back to us if you need any further assistance. 

Regards, 

Nevitha 

[Atish Kumar]

Hello Nevitha can you please highlight the specific codes or CSS part to disable the unactive dates which you have shown in the screenshot. I have given the minDate and maxDate as you have given in above example but it could'nt work for me.

[Atish Kumar]

I have attached my code can you please revert me back what i am missing. please take a look

Attachment: syncfusion_roomscheduler_e70cd3ca.zip

[Nevitha Ravi]

Hi Atish, 

Thanks for your update. 

We have checked the shared sample in which you have outdated version of Syncfusion package that don’t have the min and max date feature. So we request to upgrade your version to avail the feature. We have modified the shared sample with latest CDN link of source file. 

              <script src="datasource.js" type="text/javascript"></script> 

              <script src="https://cdn.syncfusion.com/ej2/18.4.34/dist/ej2.min.js" type="text/javascript"></script> 

              <link rel='nofollow' href="material.css" rel="stylesheet"> 

              <link rel='nofollow' href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> 

Regards, 

Nevitha 

[Nevitha Ravi]

Hi Atish,

Please find the sample.
https://www.syncfusion.com/downloads/support/forum/161520/ze/SYNCFU~1-345406470

Regards, 

Nevitha 

[Atish Kumar]

Thanks, Nevitha it worked.

[Nevitha Ravi]

Hi Atish, 

You are welcome..! please get back to us if you need any further assistance. 

Regards, 

Nevitha