ToolBar PHP Class Overview
The Kendo UI ToolBar for PHP is a server-side wrapper for the Kendo UI ToolBar widget.
Getting Started
Configuration
Below are listed the steps for you to follow when configuring the Kendo UI ToolBar for PHP.
Step 1 Make sure you followed all the steps from the introductory article on Telerik UI for PHP—include the autoloader, JavaScript, and CSS files.
Step 2 Create a ToolBar and specify the widget's commands.
<?php
$toolbar = new \Kendo\UI\ToolBar('toolbar');
$toolbar->addItem(
//regular button
array("type" => "button", "text" => "Button"),
//toggle button
array("type" => "button", "text" => "Toggle Button", "togglable" => true),
//split button
array(
"type" => "splitButton",
"text" => "Insert",
"menuButtons" => array(
array("text" => "Insert above", "icon" => "insert-top"),
array("text" => "Insert between", "icon" => "insert-middle"),
array("text" => "Insert below", "icon" => "insert-bottom")
)
),
//button group
array(
"type" => "buttonGroup",
"buttons" => array(
array("spriteCssClass" => "k-tool-icon k-justifyLeft", "text" => "Left", "togglable" => true, "group" => "text-align"),
array("spriteCssClass" => "k-tool-icon k-justifyCenter", "text" => "Center", "togglable" => true, "group" => "text-align"),
array("spriteCssClass" => "k-tool-icon k-justifyRight", "text" => "Right", "togglable" => true, "group" => "text-align")
)
),
//separator
array("type" => "separator"),
//custom template
array("template" => "<input id='dropdown' style='width: 150px;' />", "overflow" => "never"),
);
?>
Step 3 Output the ToolBar by echoing the result of the render
method.
<?php echo $toolbar->render(); ?>
Event Handling
You can subscribe to all ToolBar events.
Specify Function Names
The example below demonstrates how to subscribe for events by specifying a JavaScript function name.
<?php
$toolbar = new \Kendo\UI\ToolBar('#container');
$toolbar->addItem(
array("type" => "button", "text" => "Button"),
);
// The 'onClick' JavaScript function will handle the 'click' event of the toolbar
$toolbar->click('onClick');
echo $toolbar->render();
?>
<script>
function onClick() {
// Handle the show event
}
</script>
Provide Inline Code
The example below demonstrates how to subscribe to events by providing inline JavaScript code.
<?php
$toolbar = new \Kendo\UI\ToolBar('#container');
$toolbar->addItem(
array("type" => "button", "text" => "Button"),
);
// Provide inline JavaScript code that will handle the 'click' event of the toolbar
$toolbar->click('function() { /* Handle the show event */ }');
echo $toolbar->render();
?>
Reference
Client-Side Instances
You are able to reference an existing ToolBar instance via the jQuery.data()
. Once a reference is established, use the ToolBar API to control its behavior.
<?php
$toolbar = new \Kendo\UI\ToolBar('#container');
$toolbar->addItem(
//regular button
array("type" => "button", "text" => "Button"),
);
echo $toolbar->render();
?>
<script>
$(function() {
// The constructor parameter is used as a selector for getting toolbar's container
var toolbar = $("#container").data("kendoToolBar");
});
</script>