A brief analysis of common operations of GridView in Yii2, a brief analysis of yii2gridview_PHP tutorial

A brief analysis of the common operations of GridView in Yii2, a brief analysis of yii2gridview

This article is the editor's collection of most of the problems that occur in GridView on the Internet. This article is here to make a summary Share it on the Bangkejia platform for everyone’s reference.

If there are any frequently asked questions about GridView that are not mentioned below, leave a message below and I will add them.

Drop down search

Date formatting and date searchability

Whether to display based on parameters

The link can be clicked to jump

Show pictures

html rendering

Custom button

Set width and other styles

Custom fields

Custom row style

Add button to call js operation

yii2 GridView drop-down search implementation case tutorial

Yii2 GridView date formatting and date searchability case

Whether to display a certain column of cases

Let’s take a simple case

Condition: There is a get parameter type

Requirement: The column name will be displayed only when the value of type is equal to 1, otherwise the column will not be displayed

The code is implemented as follows:

[
'attribute' => 'name',
'value' => $model->name,
'visible' => intval(Yii::$app->request->get('type')) == 1,
],

The implementation method is also very simple.

Link can be clicked to jump to the case

This is very similar to the html rendering effect we are going to talk about next. What we are going to talk about here is the attribute value format of the column. For specific formats, you can view the file yiii18nFormatter.php. Various formats can be solved

[
'attribute' => 'order_id',
'value' => function ($model) {
return Html::a($model->order_id, "/order?id={$model->order_id}", ['target' => '_blank']);
},
'format' => 'raw',
],

Show picture case

Same as above, here you only need to specify the format format as image. The second parameter of format can set the image size. You can refer to the code below

[
'label' => '头像',
'format' => [
'image', 
[
'width'=>'84',
'height'=>'84'
]
],
'value' => function ($model) { 
return $model->image; 
}
],

html rendering case

What does it mean? For example, we have a field marked title, but this title is different. It contains html tags. We don’t want to display the form e388a4556c0f65e1904146cc1a846beetitle123e388a4556c0f65e1904146cc1a846bee on the page. We If you want title123 to be displayed in the form of a p tag, the code can be referenced as follows. You only need to specify the format as raw form

[
'attribute' => 'title',
'value' => function ($model) { 
return Html::encode($model->title); 
},
'format' => 'raw',
],

Custom button case

Often we don’t want to delete the button on the list page, but want to add a button such as Get xxx. How to do it? Here you need to set up the ActionColumn class, modify the configuration item template and add the get-xxx added in the template to the buttons item

[
'class' => 'yii\grid\ActionColumn',
'template' => '{get-xxx} {view} {update}',
'header' => '操作',
'buttons' => [
'get-xxx' => function ($url, $model, $key) { 
return Html::a('获取xxx', $url, ['title' => '获取xxx'] ); 
},
],
],

Set width case

To give a simple example, our title column is too long. Can you set the width of this column for me first?

Answer: Yes.

See example:

[
'attribute' => 'title',
'value' => 'title',
'headerOptions' => ['width' => '100'],
],

You only need to specify the configuration item headerOptions.

Custom field case

When to customize? Here we mean adding a column to the table and the corresponding column does not exist in the database. Suppose we add a new column of order consumption amount money and this field does not exist in the table

[
'attribute' => '消费金额',
'value' => function ($model) {
// 这里可以根据该表的其他字段进行关联获取
}
],

Custom row style

Some friends said that in the gridview table generated by GII, the color of the rows is not obvious, and it looks uncomfortable. I am obedient. We will not investigate the specific reasons for the discomfort. Let’s take a look at how to define row styles

<&#63;= GridView::widget([
// ......
'dataProvider' => $dataProvider,
'rowOptions' => function($model, $key, $index, $grid) {
return ['class' => $index % 2 ==0 &#63; 'label-red' : 'label-green'];
},
// ......
]); &#63;>

The previous operations are all based on columns. Since this is the control of rows, we need to pay a little attention when configuring rowOptions. In addition, the customized label-red and label-green need to be implemented with corresponding styles. Here we take a look at the actual effect of the page

Add button call js operation case

The product manager over there came over, Xiao Wang, you have this function of modifying the status very frequently. Every time you have to click on the details page before you can modify it, can I successfully modify it with just one click of the mouse on the list page? Woolen cloth?

In fact, it is an asynchronous request that operates the status of the current row. Let’s take a look at how it is implemented in gridview.

[
'class' => 'yii\grid\ActionColumn',
'header' => '操作',
'template' => '{view} {update} {update-status}',
'buttons' => [
'update-status' => function ($url, $model, $key) {
return Html::a('更新状态', 'javascript:;', ['onclick'=>'update_status(this, '.$model->id.');']); },
],
],

We need to write js on the page to implement the update_status method. Please click for reference on how to load js at the bottom of the page

Supplement: Commonly used functions and techniques of GridView widgets in development.

The data grid or GridView widget is one of the most powerful widgets in Yii.

It has an attribute called dataProvider. This attribute can provide an example of a data provider and can display the provided data, that is, using a set of column configurations of the yiigridGridView::columns attribute to render each row of data in a table. .

For example,

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

1. Table columns

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

<&#63;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' => '你确定要删除文章吗？',]
]
);
}, 
],
],

],
]);
&#63;>

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中GridView常见操作

yii2 页面底部加载css和js的技巧

浅析Yii2 GridView 日期格式化并实现日期可搜索教程

浅析Yii2 GridView实现下拉搜索教程

以上内容是针对Yii2中GridView常见操作的全部介绍，希望对大家有所帮助！

http://www.bkjia.com/PHPjc/1122885.htmlwww.bkjia.comtruehttp://www.bkjia.com/PHPjc/1122885.htmlTechArticle浅析Yii2中GridView常见操作，浅析yii2gridview 本文是小编给大家收集整理些有关网络上GridView出现的大部分问题，本文做一个总结特此分享到帮...