我要試著使用Kendoui PHP Gird進行相關開發,結果發現無法順利整合SQL Server的資料使用在Grid上。
首先如果我使用一個PHP網頁將撈取的SQL回傳JSON,再利用以下Kendoui PHP範例(含Edit的部分)可以顯示出結果,但是分頁功能是失效的。
https://docs.telerik.com/kendo-ui/php/widgets/grid/editing
//引用部分略過
<?php
$transport = new \Kendo\Data\DataSourceTransport();
$read = new \Kendo\Data\DataSourceTransportRead();
$read->url('FunctionReturnJson.php')
->contentType('application/json')
->type('GET');
$transport->read($read)
->parameterMap('function(data) {
return kendo.stringify(data);
}');
$model = new \Kendo\Data\DataSourceSchemaModel();
$sidField = new \Kendo\Data\DataSourceSchemaModelField('sid');
$sidField->type('string');
$ipField = new \Kendo\Data\DataSourceSchemaModelField('ip');
$ipField->type('string');
$lv1Field = new \Kendo\Data\DataSourceSchemaModelField('lv1');
$lv1Field->type('string');
$chtnameField = new \Kendo\Data\DataSourceSchemaModelField('chtname');
$chtnameField->type('string');
$model->addField($sidField)
->addField($ipField)
->addField($lv1Field)
->addField($chtnameField);
$schema = new \Kendo\Data\DataSourceSchema();
$schema->model($model);
// $schema = new \Kendo\Data\DataSourceSchema();
// $schema->data('data')
// ->errors('errors')
// ->groups('groups')
// ->model($model)
// ->total('total');
$dataSource = new \Kendo\Data\DataSource();
// $dataSource->transport($transport)
// ->batch(true)
// ->schema($schema);
$dataSource->transport($transport)
->pageSize(10)
->schema($schema)
->serverPaging(true)
->serverSorting(true)
->serverGrouping(true);
$grid = new \Kendo\UI\Grid('grid');
$sid = new \Kendo\UI\GridColumn();
$sid->field('sid')
->title('Contact Name')
->width(240);
$ip = new \Kendo\UI\GridColumn();
$ip->field('ip')
->title('Contact Title');
$lv1 = new \Kendo\UI\GridColumn();
$lv1->field('lv1')
->title('Company Name');
$chtname = new \Kendo\UI\GridColumn();
$chtname->field('chtname')
->width(150);
$pageable = new Kendo\UI\GridPageable();
$pageable->refresh(true)
->pageSizes(true)
->buttonCount(5);
$grid->addColumn($sid, $ip, $lv1, $chtname)
->dataSource($dataSource)
->columnMenu(true)
->pageable($pageable);
echo $grid->render();
?>
但如果用官網的Remote Bind的範例,根本無法顯示結果。
只有顯示空的Table標頭。
https://docs.telerik.com/kendo-ui/php/widgets/grid/remote-binding
<?php
$transport = new \Kendo\Data\DataSourceTransport();
$read = new \Kendo\Data\DataSourceTransportRead();
// Specify the url of the PHP page which will act as the remote service
$read->url('FunctionReturnJson.php')
->type('GET');
$transport->read($read);
// Configure the model
$model = new \Kendo\Data\DataSourceSchemaModel();
$sidField = new \Kendo\Data\DataSourceSchemaModelField('sid');
$sidField->type('string');
$ipField = new \Kendo\Data\DataSourceSchemaModelField('ip');
$ipField->type('string');
$lv1Field = new \Kendo\Data\DataSourceSchemaModelField('lv1');
$lv1Field->type('string');
$model->addField($sidField)
->addField($ipField)
->addField($lv1Field);
$schema = new \Kendo\Data\DataSourceSchema();
$schema->model($model);
$dataSource = new \Kendo\Data\DataSource();
// Configure data source
$dataSource->transport($transport)
->schema($schema);
?>
<?php
$grid = new \Kendo\UI\Grid('grid');
$sidColumn = new \Kendo\UI\GridColumn();
$sidColumn->field('sid');
$ipColumn = new \Kendo\UI\GridColumn();
$ipColumn->field('ip');
$lv1Column = new \Kendo\UI\GridColumn();
$lv1Column->field('lv1');
// Configure columns, enable paging, filtering, sorting and grouping
$grid->addColumn($sidColumn, $ipColumn, $lv1Column)
->filterable(true)
->sortable(true)
->pageable(true)
->groupable(true);
?>
<?php
echo $grid->render();
?>
希望能正常使用Grid與相關分頁功能,先謝謝指導。
補充,新手期間不能直接回應,在此補充。
1.我有用f12確認沒有任何錯誤訊息,所以確認不是js/css沒有引用到。
2.因為公司付費購買kendoui,所以希望我們用此套件開發,所以才被迫如此,不然像很多jQuery的套件都有類似功能(jquery tablesorter、jquery datatable),但老闆不喜歡。