$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 
echo $grid->render();