CODEWITHSUNDEEP
phpyiiyii2cgridview
Paritosh Mahale
Paritosh Mahale

Reputation: 1316

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 ?

Upvotes: 3

Views: 2313

Answers (1)

ScaisEdge
ScaisEdge

Reputation: 133360

 <?= 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,
        ]);
    }

Upvotes: 1

Related Questions