$tooltip->filter('div')->autoHide(false)->showOn('click')->position('right')->width(300);
$tooltip->startContent();
?>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
<?php
$tooltip->endContent();
echo $tooltip->render();
?>
<div class="configuration k-widget k-header" style="z-index:10000">
<span class="configHead">API Functions</span>
<ul class="options">
<li>
Show at
<?php
$selector = new \Kendo\UI\DropDownList('selector');
$selector->change('change')->dataTextField('text')->dataValueField('value')->dataSource(array(array('value' => 1, 'text' => 'Target 1'), array('value' => 2, 'text' => 'Target 2')));
echo $selector->render();
?>
</li>
</ul>
</div>
<div id="tooltip">
<div id="target1" class="k-group">Target 1</div>
<div id="target2" class="k-group">Target 2</div>
</div>
<script>
function change() {
$("#tooltip").data("kendoTooltip").show($("#target" + this.value()));
$result = new DataSourceResult('sqlite:..//sample.db');
echo json_encode($result->read('Products', array('ProductID', 'ProductName'), $request));
exit;
}
require_once '../include/header.php';
$transport = new \Kendo\Data\DataSourceTransport();
$read = new \Kendo\Data\DataSourceTransportRead();
$read->url('remotedatasource.php')->contentType('application/json')->type('POST');
$transport->read($read)->parameterMap('function(data) {
return kendo.stringify(data);
}');
$schema = new \Kendo\Data\DataSourceSchema();
$schema->data('data')->total('total');
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport)->schema($schema);
$dropDownList = new \Kendo\UI\DropDownList('products');
$dropDownList->dataSource($dataSource)->dataTextField('ProductName')->dataValueField('ProductID')->attr('style', 'width: 250px');
?>
<div class="demo-section">
<h2>Products</h2>
<?php
echo $dropDownList->render();
?>
</div>
<style scoped>
.demo-section {
width: 250px;
margin: 35px auto 50px;
padding: 30px;
}
.demo-section h2 {
<p>
<label for="products">Products:</label>
<?php
$read->url('cascadingdropdownlist.php?type=products');
$transport->read($read);
$products = new \Kendo\UI\DropDownList('products');
$products->dataSource(array('transport' => $transport, 'schema' => $schema, 'serverFiltering' => true))->autoBind(false)->cascadeFrom('categories')->dataTextField('ProductName')->dataValueField('ProductID')->attr('style', 'width: 300px')->optionLabel('Select product ...');
echo $products->render();
?>
</p>
<p>
<label for="orders">Orders:</label>
<?php
$read->url('cascadingdropdownlist.php?type=orders');
$transport->read($read);
$products = new \Kendo\UI\DropDownList('orders');
$products->dataSource(array('transport' => $transport, 'schema' => $schema, 'serverFiltering' => true))->autoBind(false)->cascadeFrom('products')->dataTextField('OrderID')->dataValueField('OrderID')->attr('style', 'width: 300px')->optionLabel('Select order ...');
echo $products->render();
?>
</p>
<button class="k-button" id="get">View Order</button>
</div>
<script>
$(document).ready(function () {
var categories = $("#categories").data("kendoDropDownList"),
products = $("#products").data("kendoDropDownList"),
orders = $("#orders").data("kendoDropDownList");
$("#get").click(function () {
var categoryInfo = "\nCategory: { id: " + categories.value() + ", name: " + categories.text() + " }",
productInfo = "\nProduct: { id: " + products.value() + ", name: " + products.text() + " }",
<?php
require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
?>
<div class="demo-section">
<h3>T-shirt Size</h3>
<?php
$dropDownList = new \Kendo\UI\DropDownList('select');
$dropDownList->attr('style', 'width: 200px')->attr('accesskey', 'w')->dataSource(array('X-Small', 'Small', 'Medium', 'Large', 'X-Large', '2X-Large'));
echo $dropDownList->render();
?>
</div>
<ul class="keyboard-legend">
<li>
<span class="button-preview">
<span class="key-button leftAlign wider"><a target="_blank" href="http://en.wikipedia.org/wiki/Access_key">Access key</a></span>
+
<span class="key-button">w</span>
</span>
<span class="button-descr">
focuses the widget
</span>
</li>
</ul>
<ul class="keyboard-legend">
<li>
<span class="button-preview">
<span class="key-button wider leftAlign">up arrow</span>
</span>
<span class="button-descr">
<div class="toolbar">
<label class="category-label" for="category">Show products by category:</label>
<?php
$transport = new \Kendo\Data\DataSourceTransport();
$read = new \Kendo\Data\DataSourceTransportRead();
$read->url('toolbar-template.php?type=categories')->contentType('application/json')->type('POST');
$transport->read($read)->parameterMap('function(data) {
return kendo.stringify(data);
}');
$schema = new \Kendo\Data\DataSourceSchema();
$schema->data('data');
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport)->schema($schema);
$dropDownList = new \Kendo\UI\DropDownList('category');
$dropDownList->dataSource($dataSource)->dataTextField('CategoryName')->dataValueField('CategoryID')->autoBind(false)->change('categoryChange')->optionLabel('All');
echo $dropDownList->renderInTemplate();
?>
</div>
</script>
<script>
function categoryChange() {
var value = this.value(),
grid = $("#grid").data("kendoGrid");
if (value) {
grid.dataSource.filter({ field: "CategoryID", operator: "eq", value: parseInt(value) });
<?php
require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$dropDownList = new \Kendo\UI\DropDownList('dropdownlist');
$dropDownList->dataTextField('text')->dataValueField('value')->dataSource(array(array('text' => 'Item1', 'value' => '1'), array('text' => 'Item2', 'value' => '2'), array('text' => 'Item3', 'value' => '3')))->dataBound('onDataBound')->select('onSelect')->change('onChange')->close('onClose')->open('onOpen');
?>
<div class="demo-section">
<h3 class="title">DropDownList</h3>
<?php
echo $dropDownList->render();
?>
</div>
<div class="demo-section">
<h3 class="title">Console log</h3>
<div class="console"></div>
</div>
<script>
function onOpen() {
if ("kendoConsole" in window) {
kendoConsole.log("event: open");
}
}
function onClose() {
if ("kendoConsole" in window) {
kendoConsole.log("event: close");
}
}
exit;
}
require_once '../include/header.php';
?>
<div class="demo-section">
<h2>Customers</h2>
<?php
$read = new \Kendo\Data\DataSourceTransportRead();
$read->url('template.php')->type('POST');
$transport = new \Kendo\Data\DataSourceTransport();
$transport->read($read);
$schema = new \Kendo\Data\DataSourceSchema();
$schema->data('data')->total('total');
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport)->schema($schema);
$dropDownList = new \Kendo\UI\DropDownList('customers');
$dropDownList->dataTextField('ContactName')->dataSource($dataSource)->attr('style', 'width:400px')->headerTemplate(<<<TEMPLATE
<div class="dropdown-header"><span class="k-widget k-header">Photo</span><span class="k-widget k-header">Contact info</span></div>
TEMPLATE
)->template(<<<TEMPLATE
<span class="k-state-default"><img src="../content/web/Customers/#= CustomerID #.jpg" alt="#= CustomerID #" /></span><span class="k-state-default"><h3>#: data.ContactName #</h3><p>#: data.CompanyName #</p></span>
TEMPLATE
)->valueTemplate(<<<TEMPLATE
<img class="selected-value" src="../content/web/Customers/#= CustomerID #.jpg" alt="#= CustomerID #" />
<span>#:data.ContactName#</span>
TEMPLATE
);
echo $dropDownList->render();
?>
</div>
<div class="demo-section">
require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
?>
<div id="cap-view" class="k-header">
<h2>Customize your Kendo Cap</h2>
<div id="cap" class="black-cap"></div>
<div id="options">
<h3>Cap Color</h3>
<?php
$color = new \Kendo\UI\DropDownList('color');
$color->value(1)->change('onChange')->dataTextField('text')->dataValueField('value')->dataSource(array(array('text' => 'Black', 'value' => 1), array('text' => 'Orange', 'value' => 2), array('text' => 'Grey', 'value' => 3)));
echo $color->render();
?>
<h3>Cap Size</h3>
<?php
$size = new \Kendo\UI\DropDownList('size');
$size->index(0)->dataSource(array('S - 6 3/4"', 'M - 7 1/4"', 'L - 7 1/8"', 'XL - 7 5/8"'));
echo $size->render();
?>
<button class="k-button" id="get">Customize</button>
</div>
<script>
function onChange() {
var value = $("#color").val();
$("#cap")
.toggleClass("black-cap", value == 1)
.toggleClass("orange-cap", value == 2)
.toggleClass("grey-cap", value == 3);
};
$scheduler->timezone("Etc/UTC")->date(new DateTime('2013/6/13'))->height(400)->addView(array('type' => 'day', 'startTime' => new DateTime('2013/6/13 7:00')), array('type' => 'week', 'selected' => true, 'startTime' => new DateTime('2013/6/13 7:00')), 'month', 'agenda')->dataSource($dataSource);
echo $scheduler->render();
?>
<div class="demo-section">
<p>
<label>Current Date:</label>
<?php
$datePicker = new \Kendo\UI\DatePicker('date');
$datePicker->value(new DateTime('2013/6/13'))->change('date_change');
echo $datePicker->render();
?>
</p>
<p>
<label>Current View:</label>
<?php
$viewsPicker = new \Kendo\UI\DropDownList('views');
$viewsPicker->change('views_change')->dataTextField('text')->dataValueField('value')->dataSource(array(array('text' => 'Agenda', 'value' => 'agenda'), array('text' => 'Day', 'value' => 'day'), array('text' => 'Month', 'value' => 'month'), array('text' => 'Week', 'value' => 'week')));
echo $viewsPicker->render();
?>
</p>
</div>
<script>
function views_change() {
$("#scheduler").data("kendoScheduler").view(this.value());
}
function date_change() {
$("#scheduler").data("kendoScheduler").date(this.value());
}
</script>
// ---- PHP Objects / Array ----
$obj1 = new stdClass();
$obj1->id = 1;
$obj1->value = "foo";
$obj2 = new stdClass();
$obj2->id = 2;
$obj2->value = "bar";
$obj3 = new stdClass();
$obj3->id = 3;
$obj3->value = "baz";
$myList = array($obj1, $obj2, $obj3);
// ---- Kendo UI DataSource ----
$ds = new \Kendo\Data\DataSource();
$ds->data($myList);
// ---- Kendo UI DropDownList ----
$dropList = new \Kendo\UI\DropDownList('my-list');
$dropList->dataSource($ds)->dataValueField("id")->dataTextField("value");
?>
<h2>A DropDown List</h2>
<p>
A Kendo UI DropDown list with a hard coded list
of items as the data source.
</p>
<?php
echo $dropList->render();
?>
<?php
include 'footer.php';
?>
<?php
require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
?>
<div class="demo-section">
<div class="k-rtl">
<h2>RTL DropDownList</h2>
<?php
$dropDownList = new \Kendo\UI\DropDownList('input');
$dropDownList->dataTextField('text')->dataValueField('value')->dataSource(array(array('text' => 'Item 1', 'value' => '1'), array('text' => 'Item 2', 'value' => '2'), array('text' => 'Item 3', 'value' => '3')));
echo $dropDownList->render();
?>
</div>
</div>
<style scoped>
.demo-section {
width: 250px;
margin: 35px auto 50px;
padding: 30px;
}
.demo-section h2 {
text-transform: uppercase;
font-size: 1.2em;
margin-bottom: 10px;
}
</style>
<?php
require_once '../include/footer.php';
<li>
<input id="index" value="0" class="k-textbox" style="width: 40px; margin: 0;" /> <button id="select" class="k-button">Select by index</button>
</li>
<li>
<input id="value" value="1" class="k-textbox" style="width: 40px; margin: 0;" /> <button id="setValue" class="k-button">Select by value</button>
</li>
<li>
<input id="word" value="Pulp" class="k-textbox" style="width: 100px; margin: 0;" /> <button id="find" class="k-button">Select item starting with</button>
</li>
</ul>
</div>
</div>
<div class="demo-section">
<?php
$dropDownList = new \Kendo\UI\DropDownList('movies');
$dropDownList->dataTextField('text')->dataValueField('value')->attr('style', 'width: 250px')->dataSource(array(array('text' => 'The Shawshank Redemption', 'value' => 1), array('text' => 'The Godfather', 'value' => 2), array('text' => 'The Godfather: Part II', 'value' => 3), array('text' => "Il buono, il brutto, il cattivo.", 'value' => 4), array('text' => 'Pulp Fiction', 'value' => 5), array('text' => "12 Angry Men", 'value' => 6), array('text' => "Schindler's List", 'value' => 7), array('text' => "One Flew Over the Cuckoo's Nest", 'value' => 8), array('text' => 'Inception', 'value' => 9), array('text' => 'The Dark Knight', 'value' => 10)));
echo $dropDownList->render();
?>
</div>
<script>
$(document).ready(function() {
var dropdownlist = $("#movies").data("kendoDropDownList"),
setValue = function(e) {
if (e.type != "keypress" || kendo.keys.ENTER == e.keyCode)
dropdownlist.value($("#value").val());
},
setIndex = function(e) {
if (e.type != "keypress" || kendo.keys.ENTER == e.keyCode) {
var index = parseInt($("#index").val());
dropdownlist.select(index);
