Yii2 学习笔记之 GridView DetailView

在 GridView 小部件是从数据提供者获取数据，并以一个表格的形式呈现数据。表中的每一行代表一个单独的数据项，列表示该项目的属性。在 DataGrid 小部件中的列是在 yiigridColumn 类中进行配置的。它代表一个模型属性，并可以进行过滤和排序。

GridView 列显示常用操作

<?php
echo GridView::widget([
    'dataProvider' => $dataProvider,
    'columns' => [
        'id',
        'published_at:datetime',
        [
            'label' => '排序值(越大越靠前)',
            'value' => function ($model) {
                return $model->order_num;
            }
        ],
        // 是否显示某列：意思是如果参数 type 为1的情况，该列就显示
        [
            'attribute' => 'buy_num',
            'label' => '商品总价(元)',
            'value' => function($model){
               return $model->buy_num * $model->product_price_num;
            }
            'visible' => Yii::$app->request->get('type') == 1,
        ],
        // 设定宽度：如 title 列太长了，可以限定一下
        [
            'attribute' => 'title',
            'headerOptions'=> ['width'=> '100'],
        ],
        // 短的时间显示：Y-m-d
        'create_at:date',
        // 长的时间显示：Y-m-d H:i:s
        'create_at:datetime',
        [
            'label' => '子类链接', //为字段加超链接
            'format' => 'raw',
            'value' => function ($model){
                return Html::a('属性列表', ['test/index','id'=>$model->id]);
            }
        ],
    ],
]);

自定义按钮

<?php
<?= GridView::widget([
    'dataProvider' => $dataProvider,
    'filterModel' => $searchModel,
    'columns' => [
        ['class' => 'yiigridSerialColumn'],
        'id',
        'nickname',
        'sex',
        [
            'class' => 'yiigridActionColumn',
            'template' => '{view} {update} {delete} {refresh}',
            'buttons' => [
                'refresh'=>function ($url, $model, $key) {
                    return Html::a('刷新', ['user/refresh', 'id' => $model->id, 'status'=>0], ['class' => "btn btn-xs btn-danger"]);
                }
            ]
        ],
    ],
]); ?>

使用多选框

一般用于批量设置状态或者批量删除等。

<?php
echo GridView::widget([
	// ......
    "options" => ["class" => "grid-view","style"=>"overflow:auto", "id" => "grid"],
	"columns" => [
		[
			"class" => "yiigridCheckboxColumn",
			"name" => "id",
		],
		'id',
        'name',
	],
]);

echo Html::a("批量删除", "javascript:void(0);", ["class" => "btn btn-success mybtn"]);

$this->registerJs('
    $(document).on('click', '.mybtn', function () {
    	//可以把选中的id通过ajax提交到后端，然后借助yii的deleteAll()语句进行删除或操作
		var keys = $("#grid").yiiGridView("getSelectedRows");
		console.log(keys);
    });
');
?>

GridView（搜索）数据筛选

要筛选数据，表格视图需要一个模型从过滤的表单取得输入数据，并调整 dataprovider 的查询语句到期望的搜索条件。使用active records的惯例是建立一个搜索模型类继承活动记录类。然后用这个类定义搜索的验证规则和提供 search() 方法来返回 data provider 。要给 Article 模型添加搜索能力，可以创建 ArticleSearch ，如下所示：

修改Article模型

<?php
//包含如下关联表数据
public function getAuthor()
{
    return $this->hasOne(Author::className(), ['id' => 'author_id']);
}

public function getArticleType()
{
    return $this->hasOne(ArticleType::className(), ['id' => 'article_type_id']);
}

创建ArticleSearch模型

<?php

namespace appmodels;

use Yii;
use yiibaseModel;
use yiidataActiveDataProvider;

class ArticleSearch extends Article
{
    public function rules()
    {
    	public $author_name;

        // 只有在 rules() 的字段才能被搜索
        return [
            [['status', 'article_type_id'], 'integer'],
            [['title','author_name'], 'safe'],
        ];
    }

    public function scenarios()
    {
        return Model::scenarios();
    }

    public function search($params)
    {
        $query = Article::find();
        //这里因为要调用author表进行作者名查询，所以要用到joinWith
        $query->joinWith('author');
        //在视图中，会调用级联的article_type表，调用他的分类名，所以为了性能，在这里join一下
        $query->join('articleType');
        //如果增加的字段需要表头排序，则可加入以下代码
        $dataProvider->setSort([
            'attributes' => [
                // 其它字段不要动，下面这段是加入的
                'customer_name' => [
                	'asc' => ['author.author_name' => SORT_ASC],
                    'desc' => ['author.author_name' => SORT_DESC],
                    'label' => '作者'
                ],
            ]
        ]);

        $dataProvider = new ActiveDataProvider([
            'query' => $query,
        ]);

        // 加载搜索表单数据并验证
        if (!($this->load($params) && $this->validate())) {
            return $dataProvider;
        }

        $query->andFilterWhere([
            'status' => $this->status,
            'article_type_id' => $this->article_type_id,
        ]);

        // 时间搜索，用户在view上面输入的是字符串的时间，而数据库存放的是时间戳，需转换匹配
        if ($this->created_at) {
        	$createdAt = strtotime($this->created_at);
        	$createdAtEnd = $createdAt + 24*3600;
            $query->andWhere("created_at >= {$createdAt} AND created_at <= {$createdAtEnd}");
        }

        // 通过添加过滤器来调整查询语句
        $query->andFilterWhere(['like', 'title', $this->title])
            ->andFilterWhere(['like', 'author.name', $this->author_name]);

        return $dataProvider;
    }
}

控制器调用

<?php
$searchModel = new ArticleSearch();
$dataProvider = $searchModel->search($_GET);

return $this->render('view', [
    'dataProvider' => $dataProvider,
    'searchModel' => $searchModel,
]);

视图显示

<?php
<?= GridView::widget([
    'dataProvider' => $dataProvider,
    // 表格列值搜索功能，注意一定要配合attribute才会显示
    // $searchModel = new ArticleSearch();
    'filterModel' => $searchModel,
    'options' => [
        'class' => 'grid-view table-responsive'
    ],
    'columns' => [
        'id',
        // 自定义搜索输入框，比如增加“haha样式”、和onclick事件
        [
            'attribute' => 'title',
            'filter' => Html::activeTextInput($searchModel, 'title', ['class' => 'form-control haha','onclick'=>'haha()']),
        ],
        // 此处用到了$model的关联数据，hasOne
        [
            'attribute'=>'author_id',
            'value'=>function ($model) {
                return $model->author->name;
            }
        ],
        // 下拉框搜索11 在搜索条件（过滤条件）中使用下拉框来搜索
        [
            'attribute'=>'status',
            'filter' => ['1'=>'可用','0'=>'不可用']
        ],
        // or~~~~
        [
            'class'=>commongridEnumColumn::className(),
            'attribute'=>'status',
            'enum'=>[
                '1' => '可用状态',
                '0' => '禁用状态',
            ]
        ],
        // or~~~~~
        [
            'attribute'=>'status',
            'filter' => Html::activeDropDownList($searchModel,'status',['1'=>'可用','0'=>'不可用'],['prompt'=>'全部','class'=>'form-control'])
        ],
        // 下拉框搜索22 文章分类作为下拉框选项进行索引
        [
            'attribute'=>'article_type',
            'value'=>function ($model) {
                return $model->articleType->title;
            },
            'filter'=>yiihelpersArrayHelper::map(ArticleType::find()->all(), 'id', 'title')
        ],
        'created_at:datetime'

        ['class' => 'yiigridActionColumn']
    ]
]); ?>

DetailView

<?php
<?= echo DetailView::widget([
    'model' => $model,
    'attributes' => [
        'id',
        'package_id',
        'customer_id',
        'status',
        [
            'attribute' => 'status',
            'value' => getStatus($model)
        ],
        'create_at:datetime',
    ],
]) ?>

function getStatus($model){
    return $model->status == 0? '已禁用': '可用';
}

（完）