New to Kendo UI for Angular? Start a free 30-day trial

Checkboxes

The MultiSelectTree always displays checkboxes for managing its items selection.

You can control the behavior of the checkboxes through the checkableSettings input.

Checking the Children of an Item

When you check an item that has children, you can choose whether they will also be automatically checked. To control this scenario, use the checkChildren key of the checkableSettings object. Its default value is true.

When checkChildren is enabled, you have to set loadOnDemand to 'false'. Otherwise, after a checked item gets expanded and its inner items are loaded, the elected value and the checked items in the drop-down will no longer be in sync. Currently, such a scenario is not supported.

Controlling the Selection of Items

You can specify whether clicking the checkboxes is mandatory for toggling the item selection. This is controlled by the checkOnClick key of the checkableSettings object. Its default value is true.

Example
View Source
Edit In Stackblitz  
Change Theme:

Check All

Along with the standard checkbox support, the MultiSelectTree allows you to manage the checked state of all nodes. To enable this functionality, set the checkAll option to true.

When this options is enabled, a tristate checkbox appears above the embedded treeview. Clicking that checkbox will check or uncheck all the loaded enabled items of the treeview.

When checkAll is set to true, it should be used with loadOnDemand set to false. Otherwise checkAll will not interact with the collapsed (non-loaded) subnodes of the treeview and their checked state will not be updated.

Example
View Source
Edit In Stackblitz  
Change Theme: