Yii2 Components - Data tables

Data tables

DataTable is inherited from yii\grid\GridView. It is used to display data using MDC data table.
vip9008\MDC\components\DataTable

Usage

A basic usage looks like the following:

<?php
echo DataTable::widget([
    'dataProvider' => $dataProvider,
    'columns' => [
        'name',
        'id',
        'created_at:datetime',
    ],
]);
?>

The above code will render a data table like the following:

Name ID Created at
Dr. Anais Jacobs MD
1
Sep 1, 2023, 10:11:20 AM
Mr. Arnulfo Thiel I
2
Jun 9, 1978, 11:41:35 PM
Miss Macie Wiza Sr.
3
Dec 11, 2014, 4:12:08 PM

Customization options

Data table can be further customized by adding a header and action buttons.

<?php
echo DataTable::widget([
    'dataProvider' => $dataProvider,
    [
        'title' => 'Customers list',
        // Alternative header title configuration
        // 'title' => [
        //     'content' => 'Customers list',
        //     'options' => [...], HTML attributes for header title
        // ],
        'actions' => [
            '<button class="material-icon">filter_list</button>',
            '<button class="material-icon">more_vert</button>',
        ],
        // 'options' => [...], HTML attributes for table header container
    ],
    'columns' => [
        'id',
        'name',
        'created_at:datetime',
    ],
]);
?>
Customers list
ID Name Created at
1
Lonzo Gerhold V
Nov 30, 2006, 7:47:24 AM
2
Prof. Jaydon Gorczany
Jun 16, 1979, 6:08:53 AM
3
Janice Nienow Jr.
Sep 13, 2021, 12:34:03 PM

Other options are inherited from the parent class. see yii\grid\GridView.