$productNameField->type('string')->validation(array('required' => true));
$unitPriceValidation = new \Kendo\Data\DataSourceSchemaModelFieldValidation();
$unitPriceValidation->required(true)->min(1);
$unitPriceField = new \Kendo\Data\DataSourceSchemaModelField('UnitPrice');
$unitPriceField->type('number')->validation($unitPriceValidation);
$unitsInStockField = new \Kendo\Data\DataSourceSchemaModelField('UnitsInStock');
$unitsInStockField->type('number');
$discontinuedField = new \Kendo\Data\DataSourceSchemaModelField('Discontinued');
$discontinuedField->type('boolean');
$model->id('ProductID')->addField($productIDField)->addField($productNameField)->addField($unitPriceField)->addField($unitsInStockField)->addField($discontinuedField);
$schema = new \Kendo\Data\DataSourceSchema();
$schema->data('data')->errors('errors')->model($model)->total('total');
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport)->batch(true)->pageSize(20)->schema($schema);
$grid = new \Kendo\UI\Grid('grid');
$productName = new \Kendo\UI\GridColumn();
$productName->field('ProductName')->title('Product Name');
$unitPrice = new \Kendo\UI\GridColumn();
$unitPrice->field('UnitPrice')->format('{0:c}')->width(100)->title('Unit Price');
$unitsInStock = new \Kendo\UI\GridColumn();
$unitsInStock->field('UnitsInStock')->width(100)->title('Units In Stock');
$discontinued = new \Kendo\UI\GridColumn();
$discontinued->field('Discontinued')->width(100);
$command = new \Kendo\UI\GridColumn();
$command->addCommandItem('edit')->addCommandItem('destroy')->title(' ')->width(160);
$grid->addColumn($productName, $unitPrice, $unitsInStock, $discontinued, $command)->dataSource($dataSource)->addToolbarItem(new \Kendo\UI\GridToolbarItem('create'))->height(430)->editable('popup')->pageable(true);
echo $grid->render();
?>
<?php
require_once '../include/footer.php';
$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>
<dt>City: #= City #</dt>
<dt>Address: #= Address #</dt>
</dl>
$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();
?>
<script>
public function __construct(array $cfg)
{
if (isset($cfg['primary'])) {
$this->id = isset($cfg['id']) ? $cfg['id'] : \bbn\str\text::genpwd();
$this->primary = $cfg['primary'];
if (!isset($cfg['builder'])) {
$cfg['builder'] = new \bbn\html\builder();
}
$this->builder = $cfg['builder'];
$this->grid = new \Kendo\UI\Grid($this->id);
$this->dataSource = new \Kendo\Data\DataSource();
if (isset($cfg['data'])) {
$this->dataSource->data($cfg['data']);
}
$this->schema = new \Kendo\Data\DataSourceSchema();
$this->schema->data('data');
$this->schema->total('total');
$this->model = new \Kendo\Data\DataSourceSchemaModel();
$this->model->id($cfg['primary']);
foreach ($cfg['elements'] as $e) {
if (isset($e['attr']['name'])) {
$field = new \Kendo\Data\DataSourceSchemaModelField($e['attr']['name']);
if (isset($e['attr']['name']) && isset($e['editable']) && $e['editable']) {
if (isset($e['type'])) {
$field->type($e['type']);
}
if (isset($e['null']) && $e['null']) {
$field->nullable(true);
}
if (isset($e['attr']['readonly']) && $e['attr']['readonly']) {
$field->editable(false);
} else {
if (isset($e['validation'])) {
$field->validation($e['validation']);
}
}
$this->model->addField($field);
}
if (empty($e['editable'])) {
$field->editable(false);
}
if (!empty($e['default'])) {
$field->defaultValue($e['default']);
}
}
$col = new \Kendo\UI\GridColumn();
if (!isset($e['field']) || $e['field'] !== 'hidden') {
if (isset($e['editable']) && $e['editable']) {
/*
if ( !isset($e['editor']) ){
$input = $this->builder->input($e, 1);
$sc = $input->ele_and_script();
$e['editor'] = new \Kendo\JavaScriptFunction('function(container, options) {
'.$sc[0].'.appendTo(container)'.$sc[1].'
}');
}
$col->editor($e['editor']);
*
*/
}
if (isset($e['raw'])) {
$col->encoded(false);
}
if (isset($e['data'])) {
$col->values($e['data']);
}
if (isset($e['label'])) {
$col->title($e['label']);
}
if (isset($e['attr']['name'])) {
$col->field($e['attr']['name']);
}
if (isset($e['width'])) {
$col->width((int) $e['width']);
}
if (isset($e['format'])) {
$col->format('{0:' . $e['format'] . '}');
}
if (isset($e['hidden'])) {
$col->hidden(true);
}
if (isset($e['template'])) {
$col->template($e['template']);
}
if (isset($e['editor'])) {
$col->editor($e['editor']);
}
if (isset($e['encoded'])) {
$col->encoded($e['encoded']);
}
if (isset($e['commands'])) {
foreach ($e['commands'] as $c) {
if (isset($c['click'])) {
$c['click'] = new \Kendo\JavaScriptFunction($c['click']);
}
$col->addCommandItem($c);
}
}
if (count(\bbn\tools::to_array($col)) > 0) {
$this->grid->addColumn($col);
}
}
}
if (isset($cfg['url'])) {
$this->transport = new \Kendo\Data\DataSourceTransport();
if (isset($cfg['all'])) {
$this->set_all($cfg['url']);
} else {
if (isset($cfg['select'])) {
$this->set_select($cfg['select'] === 1 || $cfg['select'] === 'on' ? 'json/select/' . $cfg['url'] : $cfg['select']);
}
if (isset($cfg['insert'])) {
$this->set_insert($cfg['insert'] === 1 || $cfg['insert'] === 'on' ? 'json/insert/' . $cfg['url'] : $cfg['insert']);
}
if (isset($cfg['update'])) {
$this->set_update($cfg['update'] === 1 || $cfg['update'] === 'on' ? 'json/update/' . $cfg['url'] : $cfg['update']);
}
if (isset($cfg['delete'])) {
$this->set_delete($cfg['delete'] === 1 || $cfg['delete'] === 'on' ? 'json/delete/' . $cfg['url'] : $cfg['delete']);
}
}
$this->dataSource->transport($this->transport);
}
if (isset($cfg['data'])) {
$this->dataSource->data($cfg['data']);
}
$this->schema->model($this->model);
$this->dataSource->schema($this->schema)->pageSize(50);
$this->grid->attr("class", "appui-full-height")->datasource($this->dataSource)->editable(['mode' => 'popup'])->filterable(true)->resizable(true)->sortable(true)->groupable(true)->pageable(true)->columnMenu(true)->edit(new \Kendo\JavaScriptFunction('function(){
$(".k-edit-form-container").parent().css({
height:"auto",
width:720,
"max-height":appui.v.height-100
}).restyle().data("kendoWindow").title("' . \bbn\str\text::escape_dquotes($cfg['description']) . '").center();
}'));
$this->cfg['args'] = [$this->id];
$this->cfg['datasource']['schema']['model']['id'] = $this->primary;
}
}
