php - yii2 Dropdown not showing completely in actionColumn in gridview
In my yii2 project, Im using a Dropdown to display the actions in actionColumn for my gridview. the problem is that the dropdown does display entirely when the number of data rows is less that 3 or 4 (just the enough space to show all the actions)-See picture-1. But when there's enough rows and space the dropdown showup correctly (see picture-2).
I tried to fix it with CSS by changing the value of z-index but no luck. If anyone would help I would be so grateful.
Picture-1
Here's my code :
['class' => 'yii\grid\ActionColumn',
'contentOptions' => ['style' => 'width:10%;'],
'header'=>'Actions',
'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' => 'Choisir',
'dropdown' => [
'encodeLabels' => false, // if you're going to use html on the items' labels
'items' => [
[
'label' => \Yii::t('yii', '<i ></i> Voir'),
'url' => ['view', 'id' => $key],
],
[
'label' => \Yii::t('yii', '<i ></i> Modifier'),
'url' => ['update', 'id' => $key],
'visible' => true,
],
[
'label' => \Yii::t('yii', '<i ></i> Valider'),
'url' => ['validate', 'id' => $key],
'visible' => true, // if you want to hide an item based on a condition, use this
],
/*[
'label' => \Yii::t('yii', "<i class='icon-city'></i> Voir le vendeurAgence"),
'url' => ['annonces', 'agence_id' => $model->vendor_id],
'visible' => true, // if you want to hide an item based on a condition, use this
],*/
[
'label' => \Yii::t('yii', '<i ></i> Supprimer'),
'linkOptions' => [
'data' => [
'method' => 'post',
'confirm' => \Yii::t('yii', 'Voulez-vous vraiment supprimer cette vente ?'),
],
],
'url' => ['delete', 'id' => $key],
'visible' => true, // same as above
],
],
'options' => [
'class' => 'dropdown-menu-right', // right dropdown
],
],
'options' => [
'class' => 'btn-default',
'style' => 'padding-left: 5px; padding-right: 5px;', // btn-success, btn-info, et cetera
],
'split' => true, // if you want a split button
]);
},
],
Picture-2