\Kendo\UI\TreeView

A PHP wrapper for Kendo UI TreeView.

Inherits from \Kendo\UI\Widget.

Usage

To use TreeView in a PHP page instantiate a new instance, configure it via the available configuration methods and output it by echo-ing the result of the render method.

Using Kendo TreeView

<?php
// Create a new instance of TreeView and specify its id
$treeView = new \Kendo\UI\TreeView('TreeView');

// Configure it
$treeView->animation(true)

// Output it

echo $treeView->render();
?>

Methods

animation

A collection of visual animations used when items are expanded or collapsed through user interaction. Setting this option to false will disable all animations. is not a valid configuration.

Returns

\Kendo\UI\TreeView

Parameters

$value boolean|\Kendo\UI\TreeViewAnimation|array

Example - using boolean

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->animation(true);
?>

Example - using \Kendo\UI\TreeViewAnimation

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$animation = new \Kendo\UI\TreeViewAnimation();
$collapse = true;
$animation->collapse($collapse);
$treeView->animation($animation);
?>

Example - using array

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$collapse = true;
$treeView->animation(array('collapse' => $collapse));
?>

autoBind

If set to false the widget will not bind to the data source during initialization. In this case data binding will occur when the change event of the data source is fired. By default the widget will bind to the data source specified in the configuration.

Returns

\Kendo\UI\TreeView

Parameters

$value boolean

Example

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->autoBind(true);
?>

autoScroll

If set to true the widget will auto-scroll the containing element when the mouse/finger is close to the top/bottom of it.

Returns

\Kendo\UI\TreeView

Parameters

$value boolean

Example

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->autoScroll(true);
?>

change

Triggered when the selection has changed (either by the user or through the select method). For additional information check the change event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->change('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onChange(e) {
        // handle the change event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->change('onChange');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->change(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

check

Triggered after the user has checked or unchecked a checkbox. If checkChildren is true, the event is triggered after all checked states are updated. This event has been introduced in internal builds after 2014.2.828. For additional information check the check event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->check('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onCheck(e) {
        // handle the check event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->check('onCheck');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->check(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

checkboxes

If true or an object, renders checkboxes beside each node.

Returns

\Kendo\UI\TreeView

Parameters

$value boolean|\Kendo\UI\TreeViewCheckboxes|array

Example - using boolean

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->checkboxes(true);
?>

Example - using \Kendo\UI\TreeViewCheckboxes

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$checkboxes = new \Kendo\UI\TreeViewCheckboxes();
$checkChildren = true;
$checkboxes->checkChildren($checkChildren);
$treeView->checkboxes($checkboxes);
?>

Example - using array

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$checkChildren = true;
$treeView->checkboxes(array('checkChildren' => $checkChildren));
?>

collapse

Triggered before a subgroup gets collapsed. Cancellable. For additional information check the collapse event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->collapse('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onCollapse(e) {
        // handle the collapse event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->collapse('onCollapse');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->collapse(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

dataBound

Triggered after the dataSource change event has been processed (adding/removing items); For additional information check the dataBound event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dataBound('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onDataBound(e) {
        // handle the dataBound event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dataBound('onDataBound');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dataBound(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

dataImageUrlField

Sets the field of the data item that provides the image URL of the TreeView nodes.

Returns

\Kendo\UI\TreeView

Parameters

$value string

Example

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dataImageUrlField('value');
?>

dataSource

Sets the data source of the dataSource.

Returns

\Kendo\UI\TreeView

Parameters

$value \Kendo\Data\HierarchicalDataSource|array

Example - using \Kendo\Data\HierarchicalDataSource

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$dataSource = new \Kendo\Data\HierarchicalDataSource();
$treeView->dataSource($dataSource);
?>

Example - using array

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$schema = new \Kendo\Data\DataSourceSchema();
$treeView->dataSource(array('schema' => $schema));
?>

dataSpriteCssClassField

Sets the field of the data item that provides the sprite CSS class of the nodes. If an array, each level uses the field that is at the same index in the array, or the last item in the array.

Returns

\Kendo\UI\TreeView

Parameters

$value string

Example

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dataSpriteCssClassField('value');
?>

dataTextField

Sets the field of the data item that provides the text content of the nodes. If an array, each level uses the field that is at the same index in the array, or the last item in the array.

Returns

\Kendo\UI\TreeView

Parameters

$value string|array

Example - using string

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dataTextField('value');
?>

Example - using array

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dataTextField(array());
?>

dataUrlField

Sets the field of the data item that provides the link URL of the nodes.

Returns

\Kendo\UI\TreeView

Parameters

$value string

Example

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dataUrlField('value');
?>

drag

Triggered while a node is being dragged. For additional information check the drag event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->drag('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onDrag(e) {
        // handle the drag event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->drag('onDrag');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->drag(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

dragAndDrop

Disables (false) or enables (true) drag-and-drop of the nodes. If configured as an object allows disabling click move click interaction as an alternative of dragging.

Returns

\Kendo\UI\TreeView

Parameters

$value boolean|\Kendo\UI\TreeViewDragAndDrop|array

Example - using boolean

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dragAndDrop(true);
?>

Example - using \Kendo\UI\TreeViewDragAndDrop

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$dragAndDrop = new \Kendo\UI\TreeViewDragAndDrop();
$clickMoveClick = true;
$dragAndDrop->clickMoveClick($clickMoveClick);
$treeView->dragAndDrop($dragAndDrop);
?>

Example - using array

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$clickMoveClick = true;
$treeView->dragAndDrop(array('clickMoveClick' => $clickMoveClick));
?>

dragend

Triggered after a node has been dropped. For additional information check the dragend event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dragend('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onDragend(e) {
        // handle the dragend event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dragend('onDragend');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dragend(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

dragstart

Triggered before the dragging of a node starts. For additional information check the dragstart event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dragstart('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onDragstart(e) {
        // handle the dragstart event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dragstart('onDragstart');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->dragstart(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

drop

Triggered when a node is being dropped. For additional information check the drop event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->drop('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onDrop(e) {
        // handle the drop event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->drop('onDrop');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->drop(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

expand

Triggered before a subgroup gets expanded. For additional information check the expand event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->expand('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onExpand(e) {
        // handle the expand event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->expand('onExpand');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->expand(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

addItem

Adds one or more TreeViewItem to the TreeView.

Returns

\Kendo\UI\TreeView

Parameters

$value[, $value2, ...] \Kendo\UI\TreeViewItem|array

Example - using \Kendo\UI\TreeViewItem

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$item = new \Kendo\UI\TreeViewItem();
$checked = true;
$item->checked($checked);
$treeView->addItem($item);
?>

Example - using array

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$checked = true;
$treeView->addItem(array('checked' => $checked));
?>

Example - adding more than one TreeViewItem

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$first  = new \Kendo\UI\TreeViewItem();
$second = new \Kendo\UI\TreeViewItem();
$treeView->addItem($first, $second);
?>

kendoKeydown

Triggered when the user presses a keyboard key while the TreeView is focused. For additional information check the kendoKeydown event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->kendoKeydown('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onKendoKeydown(e) {
        // handle the kendoKeydown event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->kendoKeydown('onKendoKeydown');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->kendoKeydown(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

loadCompleted

This event triggers only when loadOnDemand is set to false - it indicates that all nodes that need to be loaded are ready and present as data items in the DataSource of the TreeView. For additional information check the loadCompleted event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->loadCompleted('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onLoadCompleted(e) {
        // handle the loadCompleted event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->loadCompleted('onLoadCompleted');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->loadCompleted(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

loadOnDemand

Indicates whether the child DataSources should be fetched lazily when parent groups get expanded. Setting this to false causes all child DataSources to be loaded at initialization time.

Returns

\Kendo\UI\TreeView

Parameters

$value boolean

Example

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->loadOnDemand(true);
?>

messages

The text messages displayed in the widget. Use it to customize or localize the messages.

Returns

\Kendo\UI\TreeView

Parameters

$value \Kendo\UI\TreeViewMessages|array

Example - using \Kendo\UI\TreeViewMessages

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$messages = new \Kendo\UI\TreeViewMessages();
$loading = 'value';
$messages->loading($loading);
$treeView->messages($messages);
?>

Example - using array

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$loading = 'value';
$treeView->messages(array('loading' => $loading));
?>

Triggered when the user moves the focus on another node For additional information check the navigate event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->navigate('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onNavigate(e) {
        // handle the navigate event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->navigate('onNavigate');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->navigate(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

select

Triggered when a node is being selected by the user. Cancellable. For additional information check the select event documentation.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->select('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onSelect(e) {
        // handle the select event.
    }
</script>
<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->select('onSelect');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->select(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

size

Sets the size of the component.

Returns

\Kendo\UI\TreeView

Parameters

$value string

Example

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->size('value');
?>

template

Template for rendering each node.

Returns

\Kendo\UI\TreeView

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->template('value');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$treeView = new \Kendo\UI\TreeView('TreeView');
$treeView->template(new \Kendo\JavaScriptFunction('function() { }'));
?>
In this article
Not finding the help you need?