Yii2 basic Convert Gridview from table to div

Question

Is it possible to convert GridView from table format to div in the index so I can customize the look of my index; my View is

<?php Pjax::begin(); ?>    
     <?= GridView::widget([
        'dataProvider' => $dataProvider,
        'columns' => [
            ['class' => 'yii\grid\SerialColumn'],

            [ 
                'attribute' => 'Useravatar',
                'format' => 'html',
                'label' => 'Avatar',
                'value' => function ($data) {
                    return Html::img('http://localhost:8585/yii45/wfp/web/' . $data['Useravatar'],
                                    ['width' => '80px', 'height' => '80px']);
                            },
            ],

            'User_id',
            'Usermode',
            'Username',

            ['class' => 'yii\grid\ActionColumn'],
        ],
    ]); ?>
<?php Pjax::end(); ?>

if It's possible to make it something like, not exactly but somthing that use div and column

<?php Pjax::begin(); ?>    
     <?= GridView::widget([
        'dataProvider' => $dataProvider,
    ]); ?>

    <div>
    <div class="row">
        <div class="col-md-3 text-center"> Username </div>
        <div class="col-md-6"> Usermode </div>
        <div class="col-md-3 text-right"> Useravatar </div>
    </div>
    <div class="row">
        <div class="col-md-12"> Info </div>
    </div>
    <div class="row">
        <div class="col-md-6"> edit </div>
        <div class="col-md-6"> delete </div>
    </div>
</div>

<?php Pjax::end(); ?>

I found this code about ListView :

https://www.yiiframework.com/doc/guide/2.0/en/output-data-widgets#list-view

use yii\widgets\ListView;
use yii\data\ActiveDataProvider;

$dataProvider = new ActiveDataProvider([
    'query' => Post::find(),
    'pagination' => [
        'pageSize' => 20,
    ],
]);
echo ListView::widget([
    'dataProvider' => $dataProvider,
    'itemView' => '_post',
]);

But I don't know where I have to add this code

umm, what are you trying to achieve actually as it is not very clear what you actually intend to do. — Muhammad Omer Aslam
Load your dataProvider in your controller and render the ListView in the view. — nicolascolman

Bynd Bynd · Accepted Answer · 2018-03-23T15:47:22

For someone who Have the same problem like me the solution is :

in Controller Create a function Example : actionUserlist

public function actionUserlist()
    {
        $Model_User = new User;
        return $this->render('widgetUserList', [
          'Model_User' => $Model_User,
        ]);
    }

2 - Create a php file in view " widgetUserList.php "

<?php

use yii\widgets\ListView;
use yii\data\ActiveDataProvider;

$dataProvider = new ActiveDataProvider([
                'query' => $Model_User::find(),
                'pagination' => [
                'pageSize' => 15, //the number of items in a page : 15
                ],
            ]);

echo ListView::widget([
    'dataProvider' => $dataProvider,
    'itemView' => '_userList',
    ],
]);

?>

3- Create a view file " _userList.php "

<?php
use yii\helpers\Html;
use yii\helpers\HtmlPurifier;
?>
<div class="userlist">
    <h2><?= Html::encode($model->Username) ?></h2>

    <?= $model->Useremail ?>
</div>

Yii2 basic Convert Gridview from table to div

1 Answers