Configuration

Checkboxes for items

dhtmlxTree provides enhanced system of checkbox manipulations. In addition to standard two-state checkboxes that allow check/uncheck tree items, it also uses three-state checkboxes that include an intermediate state, when just some children of a parent item are checked.

In order to enable checkboxes for items, make use of the checkbox configuration option:

var tree = new dhx.Tree("tree_container", {checkbox: true});

Related sample:  Tree. Checkboxes For Items

Editing of items

It is possible to enable editing of the text of Tree items before initialization of the component using the editable configuration property:

var tree = new dhx.Tree("tree_container", {editable: true});

Related sample:  Tree. Editable

Key navigation

You can switch on key navigation in a tree with the keyNavigation property before initialization of the component:

var tree = new dhx.Tree("tree_container", {keyNavigation: true});

After that you need to select any item and then apply Arrow keys:

Related sample:  Tree. Key Navigation

Selection of items

Related sample:  Disable selection - DHTMLX Tree

The default configuration of Tree provides you with the selection feature that allows highlighting a Tree item. To disable selection in a Tree you need to set the selection configuration property to false:

const tree = new dhx.Tree("tree_container", {
    selection: false,
});
Back to top