GridView 小部件在开发中常用的功能及技巧。持续更新中....

数据网格或者说 GridView 小部件是Yii中最强大的部件之一。它有一个属性名叫 dataProvider ,这个属性能够提供一个数据提供者的示例并且可以显示所提供的数据,即使用 yii\grid\GridView::columns 属性的一组列配置,在一个表格中渲染每一行数据。

例如,

use yii\grid\GridView;
echo yii\grid\GridView::widget([
'dataProvider' => $dataProvider,
]);

一、表格列

表格的列是通过 GridView 配置项中的 yii\grid\GridView::columns 属性配置的.

<?php
use yii\grid\GridView;
echo GridView::widget([
'dataProvider' => $dataProvider, //表格列值搜索功能,注意一定要配合attribute才会显示
//$searchModel = new ArticleSearch();
'filterModel' => $searchModel, //重新定义分页样式
'layout'=> '{items}<div class="text-right tooltip-demo">{pager}</div>',
'pager'=>[
//'options'=>['class'=>'hidden']//关闭分页
'firstPageLabel'=>"First",
'prevPageLabel'=>'Prev',
'nextPageLabel'=>'Next',
'lastPageLabel'=>'Last',
] 'columns' => [
['class' => 'yii\grid\SerialColumn'],//序列号从1自增长 // 数据提供者中所含数据所定义的简单的列
// 使用的是模型的列的数据
'id',
'username', // 更复杂的列数据
[
'class' => 'yii\grid\DataColumn', //由于是默认类型,可以省略
'value' => function ($data) {
return $data->name;
// 如果是数组数据则为 $data['name'] ,
例如,使用 SqlDataProvider 的情形。
},
], ['label'=>'标题','value' => 'title'], ['label'=>'文章内容','format' => 'html','value' => 'content'], [
'label'=>'文章类别',
/*'attribute' => 'cid',产生一个a标签,点击可排序*/
'value' => 'cate.cname' //关联表
], [
//动作列yii\grid\ActionColumn
//用于显示一些动作按钮,如每一行的更新、删除操作。
'class' => 'yii\grid\ActionColumn',
'header' => '操作',
'template' => '{delete} {update}',//只需要展示删除和更新
'headerOptions' => ['width' => '240'],
'buttons' => [
'delete' => function($url, $model, $key){
return Html::a('<i class="fa fa-ban"></i> 删除',
['del', 'id' => $key],
[
'class' => 'btn btn-default btn-xs',
'data' => ['confirm' => '你确定要删除文章吗?',]
]
);
},
],
], ],
]);
?>

1. 处理时间

数据列的主要配置项是 yii\grid\DataColumn::format 属性。它的值默认是使用 \yii\i18n\Formatter 应用组件。

[
'label'=>'更新日期',
'format' => ['date', 'php:Y-m-d'],
'value' => 'updated_at'
], //or
[
//'attribute' => 'created_at',
'label'=>'更新时间',
'value'=>function($model){
return date('Y-m-d H:i:s',$model->created_at);
},
'headerOptions' => ['width' => '170'],
],

2. 处理图片

[
'label'=>'封面图',
'format'=>'raw',
'value'=>function($m){
return Html::img($m->cover,
['class' => 'img-circle',
'width' => 30]
);
}
],

3. 数据列有链接

 [
'attribute' => 'title',
'value' => function ($model, $key, $index, $column) {
return Html::a($model->title,
['article/view', 'id' => $key]);
},
'format' => 'raw',
],

4. 数据列显示枚举值(男/女)

 
[
'attribute' => 'sex',
'value'=>function ($model,$key,$index,$column){
return $model->sex==1?'男':'女';
}, //在搜索条件(过滤条件)中使用下拉框来搜索
'filter' => ['1'=>'男','0'=>'女'],
//or
'filter' => Html::activeDropDownList($searchModel,
'sex',['1'=>'男','0'=>'女'],
['prompt'=>'全部']
)
],
[
'label'=>'产品状态',
'attribute' => 'pro_name',
'value' => function ($model) {
$state = [
'0' => '未发货',
'1' => '已发货',
'9' => '退货,已处理',
];
return $state[$model->pro_name];
},
'headerOptions' => ['width' => '120']
]

yii2模板的更多相关文章

  1. yii2 模板twig中使用GridView::widget

    yii框架twig模板中使用GridView::widget 需要这样写: {{ grid_view_widget({ 'dataProvider': provider, 'columns': [ ' ...

  2. yii2 使用twig 模板引擎

    yii2 默认使用PHP 和html 混合的方式来写视图层,但我个人还是喜欢纯模板语言的方式.而且已经非常习惯使用twig的语法,最近想使用yii2进行开发,所以还是选择使用twig视图引擎. git ...

  3. Yii2的相关学习记录,自定义gii模板和引用vendor中的js、css(四)

    上文中后台模板框架已经搭建起来了,但还是有些不协调,像是有两个User标题,或者我们想自己在gii生成时添加或删除些公用的东西.这就需要我们定义自己的gii模板. 我们以CRUD的模板为例,默认的gi ...

  4. Yii2的相关学习记录,后台模板和gii(三)

    前面已经可以正常登录,但我们需要体验下最常用的增删查改的操作.这里就需要gii,通过gii可以方便的生成表单.表格的框架,不需要我们再写重复的东西. gii访问地址:http://localhost/ ...

  5. Yii2高级模板vendor和application非同级目录部署

    上面是Yii2的高级模板,当我们有多个application的时候,这种高级模板可以可以提供很好的扩展性,多个application共用一份YII2框架,默认情况下,框架和application是在同 ...

  6. yii2高级模板使用一个域名管理前后台

    yii2的高级模板分为backend和frontend,最开始用yii的时候并没怎么在意,就使用了两个域名分别解析前后台.今天无意间看见 可以使用一个域名指向前后台. 1.修改 advanced/ba ...

  7. Yii2 高级模板不使用Apache配置目录,将前后台入口移到根目录

    刚刚入手Yii2高级模板不久,部署项目时,得部署2个应用,个人感觉很繁琐,就将前后台入口文件全部拿到项目根目录.但是一看,完了,出错了!找教程找不到,还是自己解决吧 为了以后好升级,不改变Yii2核心 ...

  8. Yii2高级模板的安装

    1.通过composer 安装高级版 C:wampwwwyii>composer create-project --prefer-dist yiisoft/yii2-app-advanced a ...

  9. [Yii2] 快速套模板,加载JS,CSS(HTML标签<base>)

    刚开始学,弄了好久,不知道怎么加载JS.CSS,以及怎么不加载YII2自带的模板!其实真的好简单! 补: 其实是我垃圾,YII2默认访问路径是WEB,所以把style文件放到web下就能加载! 首先把 ...

随机推荐

  1. 3-1 vue-resource基础介绍

    1.静态引用 <script src="https://cdn.bootcss.com/vue-resource/1.3.4/vue-resource.js">< ...

  2. 【咸鱼教程】BitmapLabel位图字体使用

    引擎版本3.2.6 教程目录一 为什么要使用位图字体二 如何使用位图字体2.1 TextureMerger制作位图字体2.2 exml中使用位图字体三 Demo源码 一  为什么要使用位图字体egre ...

  3. lombok 转载

    http://www.blogjava.net/fancydeepin/archive/2012/07/12/lombok.html LomBok主要特性有:自动生成默认的getter/setter方 ...

  4. NodeJS 实现基于 token 的认证应用

    此段摘自 http://zhuanlan.zhihu.com/FrontendMagazine/19920223 英文原文 http://code.tutsplus.com/tutorials/tok ...

  5. PhoneGap安装配置

    PhoneGap是一能够让你用普通NewsShow的web技术编写出能够轻松调用API接口和进入应用商店的HTML5应用开发平台.是唯一的一个支持7个平台的开源移动框架.它的优势是无以伦比的:开发成本 ...

  6. Windows Server 2008 R2之五操作主控的管理

    一.概述 操作主控(FSMO)也称作操作主机(OM),它是指在AD中一个或多个特殊的DC,用来执行某些特殊的功能(资源标识符SID分配.架构修改.PDC选择等). 1.操作主控的分类 基于森林的操作主 ...

  7. yii---进行接受参数

    GET接受参数: Yii::$app->request->get($key, $default):第一个参数($key)为用户get请求的key,第一个参数选填:第二个参数($defaul ...

  8. PostgreSql数据库查询表信息/列信息(列ID/列名/数据类型/长度/精度/是否可以为null/默认值/是否自增/是否是主键/列描述)

    查询表信息(表名/表描述) select a.relname as name , b.description as value from pg_class a ) b on a.oid = b.obj ...

  9. POJ 1700 - Crossing River

    Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 13982   Accepted: 5349 Description A gr ...

  10. PyQT5-QCalendarWidget 日历显示

    """ QCalendarWidget:提供了日历插件 Author:dengyexun DateTime:2018.11.22 """ f ...