How to display action button as dropdown in Yii2 g

Question

I would like to display action button as dropdown in Yii 2 gridview. How can I achieve that without using any extension?

I have added the source code bellow-

<?= GridView::widget([
    'dataProvider' => $dataProvider,
    'filterModel' => $searchModel,
    'columns' => [
                ['class' => 'yii\grid\SerialColumn'],

                'id',
                'name',

                ['class' => 'yii\grid\ActionColumn',
                    'template'=>'{view}{update}{delete}',
                    'buttons' => [
                        'view' => function ($url, $model) {
                            return Html::a('<span class="glyphicon glyphicon-eye-open"></span>', $url, [
                                'title' => Yii::t('app', 'View'),
                            ]);
                        },
                        'update' => function ($url, $model) {
                            return Html::a('<span class="glyphicon glyphicon-pencil"></span>', $url, [
                                'title' => Yii::t('app', 'Update'),
                            ]);
                        },
                    ],

                    'urlCreator' => function ($action, $model, $key, $index) {
                        if ($action === 'view') {
                            $url ='/site/view?id='.$model->id;
                            return $url;
                        }
                        if ($action === 'update') {
                            $url ='/site/update?id='.$model->id;
                            return $url;
                        }
                    }
                ],
    ],
]); ?>

Answer 1

Here is how I did it:

use yii\bootstrap\ButtonDropdown;

// ... GridView configuration ...
[
    'class' => 'yii\grid\ActionColumn',
    'template' => '{all}',
    'buttons' => [
        'all' => function ($url, $model, $key) {
            return ButtonDropdown::widget([
                'encodeLabel' => false, // if you're going to use html on the button label
                'label' => 'Options',
                'dropdown' => [
                    'encodeLabels' => false, // if you're going to use html on the items' labels
                    'items' => [
                        [
                            'label' => \Yii::t('yii', 'View'),
                            'url' => ['view', 'id' => $key],
                        ],
                        [
                            'label' => \Yii::t('yii', 'Update'),
                            'url' => ['update', 'id' => $key],
                            'visible' => true,  // if you want to hide an item based on a condition, use this
                        ],
                        [
                            'label' => \Yii::t('yii', 'Delete'),
                            'linkOptions' => [
                                'data' => [
                                    'method' => 'post',
                                    'confirm' => \Yii::t('yii', 'Are you sure you want to delete this item?'),
                                ],
                            ],
                            'url' => ['delete', 'id' => $key],
                            'visible' => true,   // same as above
                        ],
                    ],
                    'options' => [
                        'class' => 'dropdown-menu-right', // right dropdown
                    ],
                ],
                'options' => [
                    'class' => 'btn-default',   // btn-success, btn-info, et cetera
                ],
                'split' => true,    // if you want a split button
            ]);
        },
    ],
],
// ... additional GridView configuration ...

You can check ButtonDropdown documentation here.

Answer 2

Google "Bootstrap Dropdowns" and then replace actions in 'template'=>'{view}{update}{delete}' with what you find. Leaving these three actions instead of text.

Regards.