首页 > 走进后端

Yii2 GridView自定义搜索栏和columns属性使用

时间:2020-06-17|浏览次数:1525次

基本用法

网格列的配置。 每个数组元素表示一个特定的网格列的配置。例如,

[
    ['class' => SerialColumn::className()],
    [   
        'class' => DataColumn::className(), // this line is optional
        'attribute' => 'name',
        'format' => 'text',
        'label' => 'Name',
    ],
    ['class' => CheckboxColumn::className()],
]

如果列是 yii\grid\DataColumn 的类,"class" 元素将会被省略。

作为快捷方式格式, 可以使用字符串来指定包含 attribute, format 和/或 label 选项:"attribute:format:label"。 例如,上面的 "name" 列也可以指定为:"name:text:Name"。 "format" 和 "label" 都是可选的。如果不存在,它们将采用默认值。

使用快捷方式格式,在简单情况下,列的配置如下所示:

[    
    'id',    
    'amount:currency:Total Amount',    
    'created_at:datetime',
]

将 $dataProvider 与活动记录一起使用时,你可以显示相关记录中的值, 例如 author 关联的 name 属性:

// shortcut syntax
'author.name',
// full syntax
[ 
    'attribute' => 'author.name',
    // ...
]

详细请查看 https://www.yiichina.com/doc/api/2.0/yii-grid-gridview#$columns-detail

DataColumn几个功能类:

  • ActionColumn 显示操作按钮等

  • CheckboxColumn 显示复选框

  • RadioButtonColumn 显示单选框

  • SerialColumn 显示行号

自定义显示内容

<?= GridView::widget([
    'dataProvider' => $dataProvider,
    'filterModel' => $searchModel,
    'columns' => [
        // ...
        [
            'attribute' => 'status',
            'value'=>function($model){
                return $model->status?'禁用':'启用';
            }
        ],
        [
                    'attribute' => 'name',
                    'content'=>function($model, $key, $index, $column){
                        return $model->name;
                    }
                ],
        
        // ...
    ],
]); ?>

匿名函数中利用系统参数展示

// 任意地方定义
<?php
    Yii::$app->params['statusLabels'] = ['禁用','启用'];
?>

// 直接使用
<?= GridView::widget([
    'dataProvider' => $dataProvider,
    'filterModel' => $searchModel,
    'columns' => [
        // ...
        [
            'attribute' => 'status',
            'value'=>function($model){
                return Yii::$app->params['statusLabels'][$model->status];
            }
        ],
        // ...
    ],
]); ?>

自定义搜索栏

增加过滤下拉,这个主要是看filter

<?= GridView::widget([
    'dataProvider' => $dataProvider,
    'filterModel' => $searchModel,
    'columns' => [
        // ...
        
        [
            'attribute' => 'status',
            'filter' => Html::activeDropDownList($searchModel, 'status', [0=>'禁用',1=>'启用'], ['class' => 'form-control']),
            'value'=>function($model){
                return $model->status?'禁用':'启用';
            }
        ],
        
         // ...
    ],
]); ?>

自定义控制列样式

<?= GridView::widget([
    'dataProvider' => $dataProvider,
    'filterModel' => $searchModel,
    'columns' => [
        // ...
        
        [
            'attribute' => 'status',
            'headerOptions'=>['class'=>'text-center'],
            'contentOptions'=>['class'=>'text-center'],
        ],
        
         // ...
    ],
]); ?>