From 274e6b6a92df15953eb6648f68cda3a4937d1e40 Mon Sep 17 00:00:00 2001 From: Alberto Rodriguez Date: Thu, 19 May 2022 16:27:10 -0400 Subject: [PATCH 1/3] fix datatables script, add autoWidth: false --- src/View/Helper/DatatableHelper.php | 58 ++++++++++++++++------------- 1 file changed, 33 insertions(+), 25 deletions(-) diff --git a/src/View/Helper/DatatableHelper.php b/src/View/Helper/DatatableHelper.php index 69a1180..9201c26 100644 --- a/src/View/Helper/DatatableHelper.php +++ b/src/View/Helper/DatatableHelper.php @@ -44,7 +44,7 @@ class DatatableHelper extends Helper 'drawCallback' => null, //complete callback function 'onCompleteCallback' => null, - + 'ajaxUrl' => null, ]; private $columnSearchTemplate = <<'); + $(cell).html(''); // On every keypress in this input $( @@ -120,7 +120,7 @@ class DatatableHelper extends Helper // API callback %s - // Generic search + // Generic search %s // Datatables configuration @@ -132,7 +132,8 @@ class DatatableHelper extends Helper $('#%s').DataTable({ orderCellsTop: true, fixedHeader: true, - ajax: getData(), + autoWidth: false, + ajax: getData(), //searching: false, pageLength: %s, processing: %s, @@ -143,8 +144,8 @@ class DatatableHelper extends Helper %s ], columnDefs: [ - %s - ], + %s + ], language: %s, lengthMenu: %s, //@todo add function callback in callback Datatable function @@ -155,7 +156,7 @@ class DatatableHelper extends Helper //onComplete %s - //column search + //column search %s }, @@ -215,9 +216,9 @@ public function setConfigKey($key, $value = null, $merge = true) * * @param string|array $url url to ajax call */ - public function setGetDataUrl($url = null) + public function setGetDataUrl($defaultUrl = null) { - $url = (array)$url; + $url = (array) $this->getConfig('ajaxUrl', $defaultUrl); $url = array_merge($url, ['fullBase' => true, '_ext' => 'json']); $url = $this->Url->build($url); @@ -225,22 +226,26 @@ public function setGetDataUrl($url = null) $extraFields = $this->processExtraFields(); //@todo change to async or anonymous js function $this->getDataTemplate = << { return { - url:'{$url}', + url:'{$url}', data: function ( d ) { - return $.extend( {}, d, { + return $.extend( {}, d, { $extraFields }); - } - } - } + } + } + }; GET_DATA; } else { + // @todo setConfig type POST $this->getDataTemplate = << { - let res = await fetch('{$url}') - } + return { + url:'{$url}', + type: 'POST', + } + }; GET_DATA; } } @@ -278,7 +283,7 @@ public function setRowActions(?iterable $rowActions = null) $this->rowActions = [ 'name' => 'actions', 'orderable' => 'false', - 'width' => '30px', + 'width' => '60px', //@todo: provide template customization for row actions default labels 'links' => [ [ @@ -417,13 +422,16 @@ protected function processColumnRenderCallbacks() $output .= "\nrender: function(data, type, obj) { "; $links = $this->processActionLinkList((array)$key['links']); $output .= "return " . implode("\n + ", $links); - $output .= '}'; - } elseif ($key['render'] ?? null) { - $output .= "render: {$key['render']}"; - } elseif ($key['orderable'] ?? null) { - $output .= "orderable: {$key['orderable']}"; - } elseif ($key['width'] ?? null) { - $output .= "width: '{$key['width']}'"; + $output .= '},'; + } + if ($key['render'] ?? null) { + $output .= "\nrender: {$key['render']},"; + } + if ($key['orderable'] ?? null) { + $output .= "\norderable: {$key['orderable']},"; + } + if ($key['width'] ?? null) { + $output .= "\nwidth: '{$key['width']}',"; } } $output .= '}'; From e8f5cb3a72e8ea624eb55a4f5ddfc4d8f4fc2691 Mon Sep 17 00:00:00 2001 From: Alberto Rodriguez Date: Fri, 20 May 2022 11:22:35 -0400 Subject: [PATCH 2/3] ref 31397: chage to Text::insert, add css to config _default --- src/View/Helper/DatatableHelper.php | 84 +++++++++++++++++------------ 1 file changed, 50 insertions(+), 34 deletions(-) diff --git a/src/View/Helper/DatatableHelper.php b/src/View/Helper/DatatableHelper.php index 9201c26..c81ab66 100644 --- a/src/View/Helper/DatatableHelper.php +++ b/src/View/Helper/DatatableHelper.php @@ -6,6 +6,7 @@ namespace CakeDC\Datatables\View\Helper; use Cake\Utility\Inflector; +use Cake\Utility\Text; use Cake\View\Helper; use Cake\View\View; use CakeDC\Datatables\Datatables; @@ -45,10 +46,16 @@ class DatatableHelper extends Helper //complete callback function 'onCompleteCallback' => null, 'ajaxUrl' => null, + 'autoWidth' => false, + 'tableCss' => [ + 'width' => '100%', + 'table-layout' => 'fixed', + 'word-wrap' => 'break-word', + ], ]; + // @todo change to Text::insert format private $columnSearchTemplate = << { //@todo use configuration for multicolumn filters - %s + :columnSearchTemplate - $('#%s').DataTable({ + const dt = $('#:tagId'); + + dt.DataTable({ orderCellsTop: true, fixedHeader: true, - autoWidth: false, + autoWidth: :autoWidth, ajax: getData(), //searching: false, - pageLength: %s, - processing: %s, - serverSide: %s, + pageLength: :pageLength, + processing: :processing, + serverSide: :serverSide, //@todo: add option to select the paging type //pagingType: "simple", columns: [ - %s + :configColumns ], columnDefs: [ - %s + :definitionColumns ], - language: %s, - lengthMenu: %s, + language: :language, + lengthMenu: :lengthMenu, //@todo add function callback in callback Datatable function - drawCallback: %s, + drawCallback: :drawCallback, //@todo use configuration instead initComplete: function () { - //onComplete - %s - + :onCompleteCallback //column search - %s - + :columnSearch }, }); + + dt.css(:tableCss); }); DATATABLE_CONFIGURATION; @@ -333,22 +343,28 @@ public function getDatatableScript(string $tagId): string $searchTemplate = ''; } - return sprintf( + // @todo change values to config _default + return Text::insert( $this->datatableConfigurationTemplate, - $this->getDataTemplate, - $searchTemplate, - $columnSearchTemplate, - $tagId, - $this->getConfig('pageLentgh') ?? '10', - $this->getConfig('processing') ? 'true' : 'false', - $this->getConfig('serverSide') ? 'true' : 'false', - $this->configColumns, - $this->definitionColumns, - json_encode($this->getConfig('language')), - json_encode($this->getConfig('lengthMenu')), - $this->getConfig('drawCallback') ? $this->getConfig('drawCallback') : 'null', - $this->getConfig('onCompleteCallback') ? $this->getConfig('onCompleteCallback') : 'null', - $this->getConfig('columnSearch') ? $this->columnSearchTemplate : '', + [ + 'getDataMethod' => $this->getDataTemplate, + 'searchTemplate' => $searchTemplate, + 'columnSearchTemplate' => $columnSearchTemplate, + 'tagId' => $tagId, + 'autoWidth' => $this->getConfig('autoWidth') ? 'true' : 'false', + 'pageLength' => $this->getConfig('pageLentgh') ?? '10', + 'processing' => $this->getConfig('processing') ? 'true' : 'false', + 'serverSide' => $this->getConfig('serverSide') ? 'true' : 'false', + 'configColumns' => $this->configColumns, + 'definitionColumns' => $this->definitionColumns, + 'language' => json_encode($this->getConfig('language')), + 'lengthMenu' => json_encode($this->getConfig('lengthMenu')), + 'drawCallback' => $this->getConfig('drawCallback') ? $this->getConfig('drawCallback') : 'null', + 'onCompleteCallback' => $this->getConfig('onCompleteCallback') ? $this->getConfig('onCompleteCallback') : 'null', + 'columnSearch' => $this->getConfig('columnSearch') ? $this->columnSearchTemplate : '', + 'tableCss' => json_encode($this->getConfig('tableCss')), + ] + ); } From 42b4a2a60a32f3d2270d3273374816df3744742a Mon Sep 17 00:00:00 2001 From: Alberto Rodriguez Date: Fri, 20 May 2022 14:40:14 -0400 Subject: [PATCH 3/3] update README --- README.md | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 2bff628..3464238 100644 --- a/README.md +++ b/README.md @@ -12,17 +12,16 @@ The recommended way to install composer packages is: composer require cakedc/cakephp-datatables ``` -# To bake datatable index pages. +### Load plugin ```shell -bin/cake bake all Articles --theme Cakedc-datatables +bin/cake plugin load CakeDC/Datatables ``` -### To overwrite existing index pages. +# To bake datatable index pages. ```shell -bin/cake bake all Articles --theme Cakedc-datatables -f +bin/cake bake all Articles -t CakeDC/Datatables ``` - # Setting up the datatable fields You can set a simple array with the columns to print or a more complex one with render callbacks, or a mix of them. ### Simple entity visible fields