\Kendo\UI\Popover

A PHP wrapper for Kendo UI Popover.

Inherits from \Kendo\UI\Widget.

Usage

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

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

// Configure it
$popover->actionsLayout('value')

// Output it

echo $popover->render();
?>

Methods

addAction

Adds one or more PopoverAction to the Popover.

Returns

\Kendo\UI\Popover

Parameters

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

Example - using \Kendo\UI\PopoverAction

<?php
$popover = new \Kendo\UI\Popover('Popover');
$action = new \Kendo\UI\PopoverAction();
$icon = 'value';
$action->icon($icon);
$popover->addAction($action);
?>

Example - using array

<?php
$popover = new \Kendo\UI\Popover('Popover');
$icon = 'value';
$popover->addAction(array('icon' => $icon));
?>

Example - adding more than one PopoverAction

<?php
$popover = new \Kendo\UI\Popover('Popover');
$first  = new \Kendo\UI\PopoverAction();
$second = new \Kendo\UI\PopoverAction();
$popover->addAction($first, $second);
?>

actionsLayout

A value indicating how the actions buttons will be positioned. Possible values are: start; center; between; around; evenly or stretch.

Returns

\Kendo\UI\Popover

Parameters

$value string

Example

<?php
$popover = new \Kendo\UI\Popover('Popover');
$popover->actionsLayout('value');
?>

animation

A collection of {Animation} objects which are used to change the default animations. If set to false, all widget animations will be disabled. animation:true is not a valid configuration.

Returns

\Kendo\UI\Popover

Parameters

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

Example - using boolean

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

Example - using \Kendo\UI\PopoverAnimation

<?php
$popover = new \Kendo\UI\Popover('Popover');
$animation = new \Kendo\UI\PopoverAnimation();
$close = new \Kendo\UI\PopoverAnimationClose();
$animation->close($close);
$popover->animation($animation);
?>

Example - using array

<?php
$popover = new \Kendo\UI\Popover('Popover');
$close = new \Kendo\UI\PopoverAnimationClose();
$popover->animation(array('close' => $close));
?>

body

Defines a kendo template that will be used as the card body inside the popover component.

Returns

\Kendo\UI\Popover

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string

<?php
$popover = new \Kendo\UI\Popover('Popover');
$popover->body('value');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$popover = new \Kendo\UI\Popover('Popover');
$popover->body(new \Kendo\JavaScriptFunction('function() { }'));
?>

filter

Specifies a selector for the elements within the container which will display the Popover.

Returns

\Kendo\UI\Popover

Parameters

$value string

Example

<?php
$popover = new \Kendo\UI\Popover('Popover');
$popover->filter('value');
?>

Defines a kendo template that will be used as the card header inside the popover component.

Returns

\Kendo\UI\Popover

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string

<?php
$popover = new \Kendo\UI\Popover('Popover');
$popover->header('value');
?>

Example - using \Kendo\JavaScriptFunction

<?php
$popover = new \Kendo\UI\Popover('Popover');
$popover->header(new \Kendo\JavaScriptFunction('function() { }'));
?>

height

The height (in pixels) of the Popover.

Returns

\Kendo\UI\Popover

Parameters

$value float

Example

<?php
$popover = new \Kendo\UI\Popover('Popover');
$popover->height(1);
?>

hide

Fires when a Popover is hidden. For additional information check the hide event documentation.

Returns

\Kendo\UI\Popover

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

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

Example - using string which defines a JavaScript name

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

Example - using \Kendo\JavaScriptFunction

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

offset

Specifies the offset (in pixels) between the Popover and the anchor. The offset is rendered from the callout arrow.

Returns

\Kendo\UI\Popover

Parameters

$value float

Example

<?php
$popover = new \Kendo\UI\Popover('Popover');
$popover->offset(1);
?>

position

The position that is relative to the target element at which the Popover will be shown.The supported values are: bottom; top; left; right or center.

Returns

\Kendo\UI\Popover

Parameters

$value string

Example

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

show

Fires when a Popover is shown. For additional information check the show event documentation.

Returns

\Kendo\UI\Popover

Parameters

$value string|\Kendo\JavaScriptFunction

Example - using string which defines a JavaScript function

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

Example - using string which defines a JavaScript name

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

Example - using \Kendo\JavaScriptFunction

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

showOn

The event on which the Popover will be shown.The supported values are: mouseenter; click or focus.

Returns

\Kendo\UI\Popover

Parameters

$value string

Example

<?php
$popover = new \Kendo\UI\Popover('Popover');
$popover->showOn('value');
?>

toggleOnClick

Defines a value indicating whether the popover will show/hide only when clicking on the target element.

Returns

\Kendo\UI\Popover

Parameters

$value boolean

Example

<?php
$popover = new \Kendo\UI\Popover('Popover');
$popover->toggleOnClick(true);
?>

width

The width (in pixels) of the Popover.

Returns

\Kendo\UI\Popover

Parameters

$value float

Example

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