CODEWITHSUNDEEP
gridviewyii2scrollbaradminltegii
Roby Sottini
Roby Sottini

Reputation: 2265

Yii2: GridView's column is too wide

I have index.php made by the Gii tool that created a CRUD. Also I use AdminLTE template.

It has the GridView that should show two columns: "Phrase" and "Author" but the column "Phrase" has some rows with long text (around 350 characters) so just a part of this column is shown. And the "Author" column is not shown at all.

There is no horizontal scroll bar (it should help me):

enter image description here

Or maybe the problem is the string data type:

public function rules()
{
    return [
        [['phrase'], 'required'],
        [['phrase'], 'string'],
        [['author'], 'string', 'max' => 50],
    ];
}

This is my index.php view:

<div class="box box-primary">
    <?php Pjax::begin(); ?>                
    <?= GridView::widget([
        'dataProvider' => $dataProvider,
        'filterModel' => $searchModel,
        'columns' => [
            'phrase',
            'author',
        ],
    ]); ?>
    <?php Pjax::end(); ?>
</div>

Upvotes: 1

Views: 2555

Answers (3)

Insane Skull
Insane Skull

Reputation: 9368

You can also use contentOptions : 

[
   'attribute' => 'phrase',
   'contentOptions' => [
       'style' => [
           'max-width' => '600px',
           'white-space' => 'normal',
       ],
   ],
],

Upvotes: 3

Roby Sottini
Roby Sottini

Reputation: 2265

I added the table-responsive class to <div class="box box-primary">

<div class="box box-primary table-responsive">
    <?php Pjax::begin(); ?>
    <?= GridView::widget([
        'dataProvider' => $dataProvider,
        'filterModel' => $searchModel,
        'columns' => [
            'frase',
            'autor',
            [
                'class' => 'yii\grid\ActionColumn',
                'template' => '{update} {delete}'
            ],
        ],
    ]); ?>
    <?php Pjax::end(); ?>
</div>

Upvotes: 2

Pratik Karmakar
Pratik Karmakar

Reputation: 257

Try This:

[
    'attribute'=>'phrase',
    'value'=>function($data){
        return strlen($data->phrase) > 100 ? Html::encode(substr($data->phrase, 0, 100)) . ". . ." : $data->phrase;
    }
]

It will display the first 100 characters from the string, if the string size is greater than 100.

Set The Value according to your desired width.

Upvotes: 0

Related Questions