Scheduler In DIV Without Scrollbar

What is the easiest way to put a scheduler in a div tag and not have a scroll bar on that div tag.

Having a scroll bar on a div and the main one on the browser window is a terrible experience.

I want the div to scale to whatever size (height) is need to display the full scheduler. Or have the scheduler scale (height) to fit within the height of its containing div.

I realize this is not really a DHTMLScheduler issue, but I am hoping some of you have already dealt with this.

Thanks.

Having a scroll bar on a div and the main one on the browser window is a terrible experience.
We have experimental extension for such task.
Try to drop the next js file after dhtmlxscheduler.js on the page, it will force scheduler to adjust its container to prevent inner scroll.
container_autoresize.zip (1.65 KB)

This works very nicely dude.

There is one catch, at least that I have found.

One of my schedules is hidden by default. I have a button that toggles it in and out of view. Since it is hidden by default, when I click the button to show the scheduler, it only displays the calendar heading and top row (dates).

However, I notice that when I resize my browser, it recalculates and the rest is displayed.

To fix my issue, in my event handler that is called when my toggle button is clicked, I now call

scheduler.callEvent("onAfterSchedulerResize", []);

This forces the auto_resize extension to recalculate its layout.

Thoughts?

Scheduler itself will not be able to detect the change of container visibility, so some kind of custom call will be necessary in any way. We will add some public method to force resize in next versions.

The code which you are using is perfectly valid and will not have any unwanted side effects.