5

I am new to yii2.. how to apply css to column, column heading of yii2 gridview??

<?php 

    $gridColumns = [
                     ['class' => 'yii\grid\SerialColumn'],
                     ['class' => 'yii\grid\CheckboxColumn'],  

                    'name',
                    'company_mail', //change the color of heading
                    'no_employees',
                    'email:email', 
                    .
                    .
                    .];
            echo GridView::widget([
            'dataProvider' => $dataProvider,
            'filterModel' => $searchModel,
            'columns' => $gridColumns,
    ]); 
    ?>

3 Answers 3

8

You can set particular column style/css using this way.

$columns = [
   'onenormalcolumn',
   'anothercolumn',
   [
       'format'=>"ntext", // or other formatter
       'attribute' => 'theattributeofmodel',
       'contentOptions' => ['style' => 'width:50px'], // For TD
       'headerOptions' => ['class' => 'ur-class'] // For TH

   ]
]
Sign up to request clarification or add additional context in comments.

Comments

1

You have to set your column in detailed mode:

<?php 
$columns = [
   'onenormalcolumn',
   'anothercolumn',
   [
       'format'=>"ntext", // or other formatter
       'attribute' => 'theattributeofmodel',
       'options'=>[ 'style'=>'your rules here' ]
   ]
]
?>

See Yii2 Gridview column options

3 Comments

I dont want to use directly .. want to give id or class... then apply style from css.. can you help??..... also i tried like this... stackoverflow.com/questions/39241292/….... but it is applying to content of table NOT to heading
Replace 'style' with 'class' in the example and set your class name as value.
'options' => [ 'class' => 'YourCustomTableClass', ], 2) Add new style rules to it (in css file): .YourCustomTableClass { color: #FF0000; }...............It is NOT changing color of column HEADING .. only changes color of table content/ ROWS
1

if you want change the column header css properties you should use headerOptions column propreties eg:

'columns' => [
    ['class' => 'yii\grid\SerialColumn'],

    .......
    'anothercolumn',
       [
        'format'=>"ntext", // or other formatter
        'attribute' => 'theattributeofmodel',
        'headerOptions'=>[ 'style'=>'background-color:#ccf8fe' ]
       ], 

],

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.