Is it possible to set focus on the Week View Template?

Scheduler Javascript
#1

Rather than always defaulting to 00:00 as the time in focus on the Week View Template, is it possible to bring the time window into focus that shows the current time of day.

In other words, if it is 4:00 pm, can the Week View template show the calendar with 4:00 pm in view? Preferably starting at 4:00 pm is the top time interval in view.

Thanks.

#2

Hello,
there is no built-in way, but you can easily manage scrollTop of the data area from code
e.g. :

function scrollToHour(hour){ var dataContainer = document.querySelector(".dhx_cal_data"); dataContainer.scrollTop = (hour - scheduler.config.first_hour) * scheduler.config.hour_size_px } // scroll to 4pm : scrollToHour(16); //or show current hour: scrollToHour((new Date()).getHours())

#3

Thank you for the code @Aliaksandr

I tried it (even fixing the missing semi-colon syntax) but I can;t get it to work.

Do you have a jsFiddle on it or anything?

#4

here you go snippet.dhtmlx.com/2980d8d20 - it scrolls down to 16.00 after initialization - I do you want it to work differently?

#5

Nevermind.

Once I fixed the syntax I tried it before scheduler.init(). It did not work.

But once I moved your code block to after the scheduler.init() it worked !!

Thanks.

#6

Thanks for the fiddle…I see that the function call needs to come after scheduler.int()

Thanks so much for the code !!

I am getting more acclimated to the plugin and I really, truly like it. I’ll probably buy PRO soon as I need the Timeline features.

Best regards.

#7

Quick question @Aliaksandr.

The scroll to works great on the Week View which is what I load first. But when I click the Day View button and look at the schedule for the day, the scroller feature does not kick in.

Is there a way to get the scrollToHour() to work on Day View as well?

#8

you can add a handler to onViewChange event, it’ll fire every time scheduler repainted, switched to another date or mode (although it’s possible to repaint scheduler without invoking this event) :

function scrollToHour(hour){ var dataContainer = document.querySelector(".dhx_cal_data"); dataContainer.scrollTop = (hour - scheduler.config.first_hour) * scheduler.config.hour_size_px } scheduler.attachEvent("onViewChange", function (new_mode , new_date){ if(new_mode == "day" || new_mode == "week"){ scrollToHour(16); } });

updated demo: snippet.dhtmlx.com/959e251bc

docs.dhtmlx.com/scheduler/api__ … event.html

#9

Perfect. Works like a charm. Thanks!