?>
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()));
}
</script>
<?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() + " }",
orderInfo = "\nOrder: { id: " + orders.value() + ", name: " + orders.text() + " }";
$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 {
text-transform: uppercase;
font-size: 1.2em;
margin-bottom: 10px;
}
</style>
<?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);
};
$(document).ready(function() {
var color = $("#color").data("kendoDropDownList");
?>
<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
$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';
?>
