1、Yii默认有四种样式的列,分别为Data column(默认)、Action column(操作)、Checkbox column(可选中)、Serial column(带序列号)
2、标题名字会根据Model中的attributeLabels()方法,来自动替换成对应的中文。当然也可以通过‘label’来自己定义,而‘attribute’则是指定根据哪个字段排序。其它的像是‘visible‘来隐藏显示,‘header‘显示头部内容,‘headerOptions‘来定义css或style样式等等。
[ ‘label‘=>‘你想要的名称‘,
‘attribute‘=>‘id‘,//可以排序的字段]
3、自定义显示页数和排序字段,如果用到了searchModel,则需要在searchModel的search方法中定义,否则,需要在Controller中定义:
$dataProvider=new ActiveDataProvider([ ‘query‘=> $query,
‘pagination‘=> [ ‘pageSize‘=> 15,//如果不定义,默认为20
],
‘sort‘=> [‘attributes‘=> [‘id‘]],//如果定义,则只能按照id来排序,否则所有字段都可以]);
4、下拉菜单检索,好比根据下拉菜单检索用户状态,则需要先在model中定义相关的方法,然后在Gridview中再做处理:
//Model中,定义一个静态方法const STATUS_DELETED=0;const STATUS_ACTIVE=10;public static function getZhStatus($status=false){ $status_array=[ ‘‘=>‘请选择‘,
self::STATUS_DELETED=>‘禁止‘,
self::STATUS_ACTIVE=>‘正常‘
]; return $status==false?$status_array:ArrayHelper::getValue($status_array,$status,‘未知‘);
}
//Gridview中[
‘attribute‘=> ‘status‘,
‘filter‘=>Html::activeDropDownList($searchModel,‘status‘,User::getZhStatus(),[‘class‘=> ‘form-control ‘]),
‘value‘=>function($data){ return User::getZhStatus($data->status);
},],
5、格式化时间,有好几种方法:
方法一:类似上面的定义回调函数
[ ‘attribute‘=>‘created_at‘,
‘value‘=>function($data){ return date(‘Y-m-d‘,$data->created_at);
},]
方法二:用Gridview自带的format配置
[ ‘attribute‘=>‘created_at‘,
‘format‘=>[‘date‘,‘php:Y-m-d‘],
‘value‘=>‘created_at‘,],
方法三:首先在config中配置好你的时间格式,否则会是英文格式的,然后再在Gridview中处理。
//在common/config/main.php中定义自己的时间、金钱等的格式‘components‘=> [ ‘formatter‘=> [ ‘dateFormat‘=> ‘yyyy-MM-dd‘,
‘datetimeFormat‘=> ‘yyyy-MM-dd HH:mm:ss‘,
‘decimalSeparator‘=> ‘,‘,
‘thousandSeparator‘=> ‘ ‘,
‘currencyCode‘=> ‘CNY‘,
],],
这里用到了快速写的一种方式:“attribute:format:label”(属性:格式:标签)这种格式,详情点击这里的api文档。所以我们这样就可以了:(如果定义了上方,则方法二可以直接‘format‘=>‘date‘即可以正确显示)
‘created_at:date‘,
6、显示超链接或图片,都是用的回调函数的方法,这里以超链接为例,注意format需要为‘raw’,不对结果做任何格式化处理,具体的格式化方面可以点这里看看。
[
‘attribute‘=>‘id‘,
‘value‘=>function($model, $key, $index, $column){ return Html::a($model->id,[‘user/view‘,‘id‘=>$model->id],[‘class‘=> ‘profile-link‘,‘target‘=>‘_blank‘]);
},
‘format‘=> ‘raw‘,],
7、关联表单显示,这个地方直接看指南吧,点这里看,总之就是如果管理买游戏表单设置好后,直接用类似order.name这种就可以直接显示使用,如果想要检索排序,则需要在searchModel的rulers规则方法和attributes属性方法中将此字段写入,在search方法中添加andFilterWhere的检索,以及用$query->joinWith关联字段,$dataProvider->sort->attributes[]添加排序等。
8、自定义Action Column按钮,
[ ‘class‘=> ‘yii\grid\ActionColumn‘,
‘header‘=>‘操作‘,
‘headerOptions‘=>[‘width‘=>‘120‘],
‘template‘=> ‘{view} {update} {delete} {forbid} ‘,
‘buttons‘=>[ ‘forbid‘=>function($url,$model){ return Html::a(‘‘,[‘user/forbid‘,‘id‘=>$model->id]);
}
],]
以上是Yii2自带的Gridview的用法。再说下kartik-v/yii2-grid,官方文档及demo讲的比较全了,它比原生的多了几个列的形式,例如Editable Column(可编辑)、Radio Column(单选框)等,还多了一些其它功能,例如滚动时可以固定标题栏方便查看、可以总计、导出svn,excel等格式。这里稍微说下:
一开始安装完成后可能会报错pdf错误,因为这些关联的还没有安装,可以按照提示安装也可以先配置‘export‘=>false来取消导出功能,下面导出时会详细配置。
1、整体结构如下图:
2、上图中各个部分非常灵活的显示或隐藏,例如我不想要header,但是还想显示共多少页这个summary,可以将其放在before中,可以如下设置:
‘panel‘=> [ ‘heading‘=>false,//不要了
‘before‘=>‘
当然上面的需求我们也可以直接用panelHeadingTemplate和panelBeforeTemplate来重新组装,具体可以查看Layout Templates小章节。
3、一些有用的小设置
‘responsive‘=>true,//自适应,默认为true‘hover‘=>true,//鼠标移动上去时,颜色变色,默认为false‘floatHeader‘=>true,//向下滚动时,标题栏可以fixed,默认为false‘showPageSummary‘=>true,//显示统计栏,默认为false
//column中的一些设置‘columns‘=> [
[ ‘class‘=> ‘\kartik\grid\CheckboxColumn‘,
‘rowSelectedClass‘=> GridView::TYPE_INFO,
‘visible‘=>true,//不显示,代码也没有
‘hidden‘=>true,//隐藏,代码还有,导出csv等时还存在
‘hiddenFromExport‘=>true,//虽然显示,但导出csv时忽略掉
‘pageSummary‘=>‘总计‘,//可以是字符串,当为true时,自动合计
‘mergeHeader‘=>true,//合并标题和检索栏
],]
4、{toggleData}设置,主要是用来显示分页还是全部数据显示
‘toggleDataOptions‘=>[ ‘maxCount‘=> 200,//当超过200条时,此按钮隐藏,以免数据太多造成加载问题
// ‘minCount‘=> 10,//当超过10条,点击时才会下面的提示
‘confirmMsg‘=> ‘总共‘. number_format($dataProvider->getTotalCount()).‘条数据,确定要显示全部?‘,//点击时的确认],
5、{export}设置,可导出excel,csv,pdf等各种类型的文件,下面为导出csv的格式,如果在exportConfig只配置了csv,则只显示导出csv,如果还想导出excel等格式,需要在exportConfig中添加。我在这里导出csv时,不管设置编码是gbk还是utf,用excel2013打开时都是中文乱码,而用sublime等编辑器打开则正常,(导出excel格式则正常),有知道此问题的朋友,麻烦留言指教。
‘export‘=>[ ‘fontAwesome‘=>‘fa fa-share-square-o‘,//图标
‘target‘=>‘_blank‘,//在新标签打开
‘encoding‘=>‘gbk‘,//编码],
‘exportConfig‘=> [
GridView::CSV=> [ ‘label‘=> ‘导出CSV‘,
‘iconOptions‘=> [‘class‘=> ‘text-primary‘],
‘showHeader‘=> true,
‘showPageSummary‘=> true,
‘showFooter‘=> true,
‘showCaption‘=> true,
‘filename‘=> ‘用户表‘.date("Y-m-d"),
‘alertMsg‘=> ‘确定要导出CSV格式文件?‘,
‘options‘=> [ ‘title‘=>‘‘,
],
‘mime‘=> ‘application/csv‘,
‘config‘=> [ ‘colDelimiter‘=> ",",
‘rowDelimiter‘=> "\r
",
],
], ],
基本也就这么多,附上我自己还比较满意设置的样式截图:(kartik-v/yii2-grid的样式依赖于bootstrap,与adminlte的表格样式相冲突,尤其是在合并标题栏和检索栏时,合并的下方边框会变粗,试了好多设置让其全部都加粗都不行,最后只能妥协,修改kartik-v/yii2-grid的kv-merged-header的默认样式,加了这一段:$this->registerCss(".kv-merged-header{border-bottom:1px solid #eee !important}");,勉强看得过去。)