この記事は、インターネット上で GridView で発生するほとんどの問題を編集者がまとめたものであり、ここに共有されます。参考までに、Bangkejia プラットフォームをご覧ください。
以下に記載されていない GridView に関するよくある質問がある場合は、以下にメッセージを残してください。追加させていただきます。
ドロップダウン検索
日付の書式設定と日付の検索可能化
パラメータに基づいて表示するかどうかを決定します
リンクをクリックするとジャンプできます
写真を表示
htmlレンダリング
カスタマイズされたボタン
幅とその他のスタイルを設定します
カスタムフィールド
カスタマイズされた行スタイル
jsオペレーションを呼び出すボタンを追加します
yii2 GridView ドロップダウン検索実装ケースのチュートリアル
yii2 GridView の日付書式設定と日付検索可能なケース
ケースの特定の列を表示するかどうか
簡単なケースを考えてみましょう
条件: getパラメータ型がある
要件: type の値が 1 に等しい場合のみ、列名が表示されます。それ以外の場合、列は表示されません
コードは次のように実装されます:
リーリー実装方法も非常に簡単です。
リンクをクリックすると事例にジャンプします
これは、次に説明する HTML レンダリング効果と非常によく似ています。ここで説明するのは、列の属性値の形式です。さまざまな形式については、ファイル yiii18nFormatter.php を確認してください。解決できます
リーリー写真ケースを表示
上記と同様に、ここではフォーマット形式を画像として指定するだけです。以下のコードを参照して、format の 2 番目のパラメータで画像サイズを設定できます。 リーリー
htmlレンダリングのケース
これはどういう意味ですか? たとえば、タイトルとマークされたフィールドがありますが、このタイトルには HTML タグが含まれています。 title123はpタグの形式で表示されており、以下のように形式をraw形式で指定するだけで参照できます。 リーリー
カスタムボタンケース
リストページのボタンを削除したくないが、「xxx を取得」などのボタンを追加したい場合があります。ここでは、ActionColumn クラスを設定し、構成項目テンプレートを変更し、テンプレートに追加された get-xxx をボタン項目に追加する必要がありますリーリー
幅を設定するケース
簡単な例を挙げると、タイトル列が長すぎます。まずこの列の幅を設定してもらえますか?答え: はい。
例をご覧ください:
リーリー
設定項目 headerOptions を指定するだけです。
カスタムフィールドケース
いつカスタマイズするか?ここでは、テーブルに列を追加することを意味しますが、対応する列がデータベースに存在しません。注文消費額の新しい列を追加し、このフィールドがテーブルに存在しないとしますリーリー
カスタム行スタイル
GII で生成されたグリッドビューのテーブルでは、行の色がはっきりせず、不快に見えるという意見もありましたが、不快感の具体的な理由については調査しません。行スタイルを定義する方法を見てみましょうリーリー
これまでの操作はすべて列に基づいています。ここでは行を制御しているため、rowOptions を構成するときに少し注意する必要があります。さらに、カスタマイズされた label-red と label-green を対応するスタイルで実装する必要があります。ここで、ページの実際の効果を見てみましょう。
ボタン呼び出しjs操作ケースを追加
そこの製品マネージャーがやって来ました、Xiao Wang、ステータスを変更する機能は頻繁にありますが、詳細ページをクリックして変更する必要がありますが、マウスを 1 回クリックするだけで正常に変更できますか。リストページ?実際、これは現在の行のステータスを操作する非同期リクエストです。グリッドビューでどのように実装されるかを見てみましょう。
リーリー
ページ内にjsの実装メソッドupdate_statusを記述する必要がありますので、ページ下部のjsの読み込み方法を参考にしてください
追加: 開発中の GridView ウィジェットの一般的に使用される機能とテクニック。
Data Grid または GridView ウィジェットは、Yii で最も強力なウィジェットの 1 つです。dataProvider という名前の属性があり、データプロバイダーの例を提供し、提供されたデータを表示できます。つまり、yiigridGridView::columns 属性の一連の列構成を使用して、テーブル内のデータの各行をレンダリングします。
たとえば、
リーリー
1. テーブルの列
表格的列是通过 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中GridView常见操作
yii2 页面底部加载css和js的技巧
浅析Yii2 GridView 日期格式化并实现日期可搜索教程
浅析Yii2 GridView实现下拉搜索教程
以上内容是针对Yii2中GridView常见操作的全部介绍,希望对大家有所帮助!