// --------- Kendo UI DataSource -------
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport)->pageSize(5)->schema($schema)->serverPaging(true);
// --------- Kendo UI Grid -------
$grid = new \Kendo\UI\Grid('grid');
$productName = new \Kendo\UI\GridColumn();
$productName->field('ProductName')->title('Product Name');
$supplier = new \Kendo\UI\GridColumn();
$supplier->field('Supplier')->title("Supplier")->editor('supplierEditor')->template("#: Supplier.SupplierName #");
$category = new \Kendo\UI\GridColumn();
$category->field('Category')->title("Category")->editor('categoryEditor')->template("#: Category.CategoryName #");
$unitPrice = new \Kendo\UI\GridColumn();
$unitPrice->field('UnitPrice')->format('{0:c}')->title('Price');
$unitsInStock = new \Kendo\UI\GridColumn();
$unitsInStock->field('UnitsInStock')->title('Stock');
$edit = new \Kendo\UI\GridColumnCommandItem('edit');
$edit->name('edit');
$destroy = new \Kendo\UI\GridColumnCommandItem('destroy');
$destroy->name('destroy');
$commandColumn = new \Kendo\UI\GridColumn();
$commandColumn->addCommandItem($edit)->addCommandItem($destroy);
$create = new \Kendo\UI\GridToolbarItem('create');
$grid->addToolbarItem($create)->addColumn($productName)->addColumn($supplier)->addColumn($category)->addColumn($unitsInStock)->addColumn($unitPrice)->addColumn($commandColumn)->dataSource($dataSource)->pageable(true)->editable("popup");
?>
<h2>Products</h2>
<p>
A complete CRUD (Create, Read, Update, Delete) demonstration of
the Kendo UI Grid, with custom column templates and pop up editor.
</p>
<?php
$transport->read($read)->parameterMap('function(data) {
return kendo.stringify(data);
}');
$model = new \Kendo\Data\DataSourceSchemaModel();
$schema = new \Kendo\Data\DataSourceSchema();
$schema->data('data')->total('total');
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport)->pageSize(10)->schema($schema)->serverPaging(true);
$grid = new \Kendo\UI\Grid('grid');
$firstName = new \Kendo\UI\GridColumn();
$firstName->field('FirstName')->title('First Name');
$lastName = new \Kendo\UI\GridColumn();
$lastName->field('LastName')->title('Last Name');
$title = new \Kendo\UI\GridColumn();
$title->field('Title');
$command = new \Kendo\UI\GridColumnCommandItem();
$command->click('commandClick')->text('View Details');
$commandColumn = new \Kendo\UI\GridColumn();
$commandColumn->addCommandItem($command)->title(' ')->width(140);
$grid->addColumn($firstName, $lastName, $title, $commandColumn)->dataSource($dataSource)->height(260)->pageable(true);
echo $grid->render();
$window = new \Kendo\UI\Window('details');
$window->title('Customer Details')->modal(true)->visible(false)->resizable(false)->width(300);
echo $window->render();
?>
<script type="text/x-kendo-template" id="template">
<div id="details-container">
<h2>#= FirstName # #= LastName #</h2>
<em>#= Title #</em>
<dl>