setitch / yii2-datatables
Yii2 Extension for DataTables jQuery plug-in - stable
Installs: 97
Dependents: 0
Suggesters: 0
Security: 0
Stars: 1
Watchers: 1
Forks: 46
Type:yii2-extension
Requires
- php: >=5.4.0
- bower-asset/datatables: ~1.10
- bower-asset/datatables-plugins: ~1.0
- yiisoft/yii2: ~2.0
This package is auto-updated.
Last update: 2025-02-06 10:46:35 UTC
README
Forked because of instability of the source project.
Yii2 DataTables
Yii2 Widget for DataTables plug-in for jQuery
Installation
The preferred way to install this extension is through composer.
Either run
composer require nullref/yii2-datatables
or add
"nullref/yii2-datatables": "~1.0"
to the require section of your composer.json
file.
Basic Usage
<?= \nullref\datatable\DataTable::widget([ 'data' => $dataProvider->getModels(), 'columns' => [ 'id', 'name', 'email' ], ]) ?>
DataTable options
Also you can use all Datatables options
To pass them as widget options:
<?= \nullref\datatable\DataTable::widget([ 'data' => $dataProvider->getModels(), 'scrollY' => '200px', 'scrollCollapse' => true, 'paging' => false, 'columns' => [ 'name', 'email' ], ]) ?>
Add Links to row
<?= \nullref\datatable\DataTable::widget([ 'columns' => [ //other columns [ 'class' => 'nullref\datatable\LinkColumn', 'url' => ['/model/delete'], 'options' => ['data-confirm' => 'Are you sure you want to delete this item?', 'data-method' => 'post'], 'queryParams' => ['id'], 'label' => 'Delete', ], ], ]) ?>
Properties of LinkColumn
:
label
- text placed ina
tag;url
- will be passed toUrl::to()
;options
- HTML options of thea
tag;queryParams
- array of params added tourl
Styling
DataTables
supports several styling solutions, including Bootstrap
, jQuery UI
, Foundation
.
'assetManager' => [ 'bundles' => [ 'nullref\datatable\DataTableAsset' => [ 'styling' => \nullref\datatable\DataTableAsset::STYLING_BOOTSTRAP, ] ], ],
Custom assets
It's posible to use custom styles and scripts:
'nullref\datatable\DataTableAsset' => [ 'sourcePath' => '@webroot/js/plugin/datatables/', 'js' => [ 'jquery.dataTables-1.10-cust.js', 'DT_bootstrap.js', ], 'css' => [ 'data-table.css', ], 'styling' => false, ]
Server-side processing
To enable server-side processing add DataTableAction
to controller like this:
class SomeController extends Controller { public function actions() { return [ 'datatables' => [ 'class' => 'nullref\datatable\DataTableAction', 'query' => Model::find(), ], ]; } }
Searching and ordering can be customized using closures
public function actions() { return [ 'datatables' => [ 'class' => 'nullref\datatable\DataTableAction', 'query' => Model::find(), 'applyOrder' => function($query, $columns, $order) { //custom ordering logic return $query; }, 'applyFilter' => function($query, $columns, $search) { //custom search logic return $query; }, ], ]; }
And add options to widget:
<?= \nullref\datatable\DataTable::widget([ /** ... */ 'serverSide' => true, 'ajax' => '/site/datatables', ]) ?>