Search code examples
phpyiiyii2cgridview

how to increase container width to fix GridView scroll in yii2


I am using yii2 GridView widget for showing data in form of table.

As there are many fields to show, GridView ( below table ) showing scroll for it. But i don't want it.

I want to increase container width so that it show table without scroll.

I had search about bootstrap.css file but not found in any directory.

How do i change GridView width ?


Solution

  •  <?= GridView::widget([
            'dataProvider' => $dataProvider,
            'filterModel' => $searchModel,
            'columns' => [
                ['class' => 'yii\grid\SerialColumn'],
          .........
                ['class' => 'yii\grid\ActionColumn'],
            ],
        'tableOptions' =>['style' => 'width: 1800px;'],
        ]); ?>
    

    or the gridview container options

     <?= GridView::widget([
            'dataProvider' => $dataProvider,
            'filterModel' => $searchModel,
            'columns' => [
                ['class' => 'yii\grid\SerialColumn'],
          .........
                ['class' => 'yii\grid\ActionColumn'],
            ],
        'options' =>['style' => 'width: 1800px;'],
        ]); ?>
    

    http://www.yiiframework.com/doc-2.0/yii-grid-gridview.html

    http://www.yiiframework.com/doc-2.0/yii-grid-gridview.html#$options-detail

    http://www.yiiframework.com/doc-2.0/yii-grid-gridview.html#$tableOptions-detail

    Otherwise if you need a larger page container you need a new layout

    add tye new layout in you app/views/layout eg:changing the container this this way

        ....
        <div class="container-fluid">    
        <?= Breadcrumbs::widget([
            'links' => isset($this->params['breadcrumbs']) ? $this->params['breadcrumbs'] : [],
        ]) ?>
        <?= Alert::widget() ?>
        <?= $content ?>
        </div>
        ....
    

    then assign you new layout to you view before render

        public function actionIndex()
        {
    
    
            ......
    
            $this->layout = 'my_new_layout'
            return $this->render('index', [
                'searchModel' => $searchModel,
                'dataProvider' => $dataProvider,
            ]);
        }