Start Building Professional
Web Apps Today

How to place tree in a scrollable div

Hi there
Congrats on the product - am impressed!
The problem I'm having is that when I expand items in the tree, the div area doesn't scroll.
I want to place the tree inside a bordered div that is always the same size, and the tree to scroll inside it.
I notice that the tree you use in your sample documentation does do this (so it is possible), however I cannot find any documentation on how you've achieved this, nor see the code as I believe it is in css.

<div id="myTree" style="width:200;height:50;overflow:auto"></div>

I've tried this, and also placing it in a containing scrollable div, but it doesnt work.
Scrollbar arrows get displayed if I use overflow:scroll, but never become enabled.

many thanks for your help

The scrolls in tree is a default behavior, they appear automatically in most cases
To be sure that scrolls will appear set overflow:hidden for container tag
    <div id="myTree" style="width:200px;height:50px;overflow:hidden"></div>
( adding px to dimension is also a necessary step, depend on used doctype it can be critical requirement )

also, when you init tree
    var tree = new dhtmlXTreeObject("myTree")
it possible to use second and third parameters to specify dimension of tree, if you need  just a default scrollbar behavior just skip those params, or set them to 100%

Thankyou for such a  prompt reply!

Things are much improved, I can now keep the tree contained in the panel (what a difference the 'px' made!)

However, when I drag items, it does not cause the div to scroll and therefor cannot drag n drop onto items not in view.

Is there a way to do this?

I saw another faq on this, but regrettably this did not resolve the issue.