Ragheb AlKilany
Ragheb AlKilany

Reputation: 933

Yii2 - Cell Edit

How to edit cell CSS (like background color) in gridview? Note that I only need to edit one cell not the whole column or row. Specifically, there is a column in grid view that's labelled 'colors', I want every cell's background color to be the same as the color written there.

Upvotes: 1

Views: 769

Answers (1)

ScaisEdge
ScaisEdge

Reputation: 133380

In gridView, in every column, you can set the contentOptions and value paramter

this is a sample where:

for a first column you assign the color for all cell of the column,

in the the second column you can assign the color for single cell based on a color value ( in this sample the color value is provided by model) evaluated inside the function. Then composing the proper html code and render in row format you set the color you desire

    <?= GridView::widget([
        'dataProvider' => $dataProvider,
        'columns' => [
            ['class' => 'yii\grid\SerialColumn'],
            [
                'attribute' => 'your_attribute',
                'label' => 'your_labe',
                'contentOptions' => ['style' => 'background-color: #000000;'], 
            ],
            ....
            ....

            [
                'attribute' => 'your_attribute_cell',
                'label' => 'your_label_cell',
                'format' => 'raw',
                'value' => function ($model) { 
                    return  "<span style='background-color:" . $model->yourColor  "'  >"  . $model->your_attribute_cell. " </span>";
                },
                'contentOptions' => ['style' => ' text-align: center; width: 100px;'],
                'headerOptions' => ['style' => 'text-align: center;'],
            ],
        ],  

Upvotes: 1

Related Questions