\Kendo\UI\Drawer

A PHP wrapper for Kendo UI Drawer.

Inherits from \Kendo\UI\Widget.

Usage

To use Drawer 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 Drawer

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

// Configure it
$drawer->autoCollapse(true)

// Output it

echo $drawer->render();
?>

Methods

autoCollapse

Specifies if the Drawer will be automatically collapsed when an item is clicked.

Returns

\Kendo\UI\Drawer

Parameters

$value boolean

Example

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->autoCollapse(true);
?>

expanded

Specifies if the Drawer will be expanded by default.

Returns

\Kendo\UI\Drawer

Parameters

$value boolean

Example

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->expanded(true);
?>

hide

Fired when the Kendo UI Drawer is about to be hidden. The event can be prevented by calling the preventDefault method of the event parameter. For additional information check the hide event documentation.

Returns

\Kendo\UI\Drawer

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->hide('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onHide(e) {
        // handle the hide event.
    }
</script>
<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->hide('onHide');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->hide(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

itemClick

Fires when user clicks on item from the Kendo UI Drawer. For additional information check the itemClick event documentation.

Returns

\Kendo\UI\Drawer

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->itemClick('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onItemClick(e) {
        // handle the itemClick event.
    }
</script>
<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->itemClick('onItemClick');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->itemClick(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

minHeight

Specifies the minimum height for the drawer in push mode. The overlay mode takes 100% of the page height.

Returns

\Kendo\UI\Drawer

Parameters

$value float

Example

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->minHeight(1);
?>

mini

Enables or configures the mini mode for the Kendo UI Drawer. This is a compact view that is displayed when the Kendo UI Drawer is collapsed. Usually it used to show only the icons when the drawer content contains icon and text for an item. When set to true it uses the main template.

Returns

\Kendo\UI\Drawer

Parameters

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

Example - using boolean

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->mini(true);
?>

Example - using \Kendo\UI\DrawerMini

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$mini = new \Kendo\UI\DrawerMini();
$template = 'value';
$mini->template($template);
$drawer->mini($mini);
?>

Example - using array

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$template = 'value';
$drawer->mini(array('template' => $template));
?>

mode

Determines how the Kendo UI Drawer will interact with the associated content. The default one (overlay) will simply overlap the associated content with overlay effect. On the other hand "push" mode will show the drawer next to associated cotent. The associated content will shrink its content.

Returns

\Kendo\UI\Drawer

Parameters

$value string

Example

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->mode('value');
?>

If set to true the use could navigate the widget using the keyboard navigation. By default keyboard navigation is disabled.

Returns

\Kendo\UI\Drawer

Parameters

$value boolean

Example

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->navigatable(true);
?>

position

The position of the drawer. Can be left (default) or right.

Returns

\Kendo\UI\Drawer

Parameters

$value string

Example

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->position('value');
?>

show

Fires before the Kendo UI Drawer is revealed. The event can be prevented by calling the preventDefault method of the event parameter. For additional information check the show event documentation.

Returns

\Kendo\UI\Drawer

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->show('function(e) { }');
?>

Example - using string which defines a JavaScript name

<script>
    function onShow(e) {
        // handle the show event.
    }
</script>
<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->show('onShow');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->show(new \Kendo\JavaScriptFunction('function(e) { }'));
?>

swipeToOpen

If set to false, swiping the associated content will not activate the drawer. In this case, the drawer will only be open by calling the show method. should be disabled for browsers, which use side swiping gestures for back/forward navigation, such as iOS Safari. Otherwise, users should swipe from an inner part of the view, and not from the view edge.

Returns

\Kendo\UI\Drawer

Parameters

$value boolean

Example

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->swipeToOpen(true);
?>

template

Specifies the drawer's content.

Returns

\Kendo\UI\Drawer

Parameters

$value string

Example

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

width

Defines a specific width for the Kendo UI Drawer when expanded.

Returns

\Kendo\UI\Drawer

Parameters

$value float

Example

<?php
$drawer = new \Kendo\UI\Drawer('Drawer');
$drawer->width(1);
?>
In this article
Not finding the help you need?