<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() + " }", orderInfo = "\nOrder: { id: " + orders.value() + ", name: " + orders.text() + " }";
<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) }); } else {
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 { text-transform: uppercase;
$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'; ?>