I want to prevent the user browsing back to previous days
1 Answer, 1 is accepted
answered on 26 Jan 2022, 04:57 PM
With the current setup of the Scheduler, you can limit it to a minimum date by disabling the "previous" navigation button if the currently selected date matches your desired minimum date, so that the user cannot navigate more backwards. You can do that with some conditional CSS. You can handle the DateChanged event of the Scheduler to check if the currently selected date matches you desired min date, so you can toggle a flag based on which the styles will be applied. You can also perform that check when the component initializes in case your predefined selected date matches the minimum.
The tricky part will be the calendar popup as even if you disable the previous button, the user will still be able to select from the calendar and there is no way to currently restrict the minimum date there. In future, the Scheduler will expose a Toolbar template where you can define your custom content - for example declare your DatePicker component where you can have control over the min date. If interested, you may vote for the request to increase its popularity as we are prioritizing the feature requests implementation based on community interest and demand. You can also follow it to receive email notifications on status changes.
At this stage, you can disable the calendar, so that you don't allow the user to open it and thus ensure they cannot select earlier date than your desired minimum. You can achieve that with CSS as well by removing the pointer events from the element that opens the Calendar. As a result, you will still have the current date displayed but it will not be clickable.