Lock dhtmlXSchedule for X hours from now

Scheduler Javascript
#1

Hello,

we have a scheduler where the user can book a lesson at least X hours from now, for example he must book with at least 24 hours in advance.
We would like then to ad a markSpan in the calendat that can mark X hours ahead of now.

We couldnt find an easy way to do that.

Thank you,
Michele

#2

Hello,
You can display a markedTimespan which won’t allow adding events before the required period of time and update it by rendering the Scheduler:

scheduler.addMarkedTimespan({
        start_date: new Date(),
        end_date: scheduler.date.add(new Date(), 24, "hour"), // define the required period of time
        css: "gray_section",
        type: "dhx_time_block", // creating events on those dates will be disabled - dates are blocked 
});

Note, that if you create a marker this way, it will block time range starting from the moment the user opened the page up to the next 24 hours.
Normally, you need this interval to be updated over time, so if the user opens the page and waits for an hour - the earliest available time will be still 24 hours in advance from the current time, and not from the time the user loaded the page.
This means you need to update the marker from the code. You can use onBeforeViewChange handler to apply a markedTimespan every time the Scheduler will be repainted:
https://docs.dhtmlx.com/scheduler/api__scheduler_onbeforeviewchange_event.html ;
To prevent overlapping of markedTimespans, you need to delete it with
deleteMarkedTimespan method:
https://docs.dhtmlx.com/scheduler/api__scheduler_deletemarkedtimespan.html ;
You can repaint the scheduler using the render method in the setInterval function:
https://docs.dhtmlx.com/scheduler/api__scheduler_render.html ;
The render function calls onBeforeViewChange event and the marker will be updated every few minutes.
Please check the example of how it might be implemented:
https://snippet.dhtmlx.com/9uuuu7sp