CGridView - how to color rows depending on data values

I have Order model.

Displaying it with CGridView it would be nice to color the rows depending on $model->order_status which is an integer from 1 to 5 for example, so 5 colors.

Could it be done by simple settings of CGridView ?


Thanks, Qiang.

Only found this example.


How to use more complex logic? put it an method of some helper class, and call method in

‘rowCssClassExpression’ ?

You could write a method in the model class which returns the desired css class name based on some attribute value.

I cannot figure out how to obtain the value of an attribute within the method I have created in my model. I have:

public function assignClass($row,$data)



   return $row;//returns an integer the number or row which is of now help

   return $data;//returns an object of CGridView but don't know how to get the value of an attribute


return $row;//returns an integer the number or row which is of now help

return $data;//returns an object of CGridView but don’t know how to get the value of an attribute

any help would be appreciated



I too would like to change the css attributes of the Gridview, so any clear examples would be helpful, like where in the model would this get implemented.

$this->{attribute name}

Thanks for your help. This however returns the metadata for the attribute. What I would like to know is how to return the value of a CGridView attribute after dataProvider has been loaded so I can calculate the CSS class to display. I had no luck with $this->{attribute name}.

Any other suggestions.



OK. Finally resolved it.

Not sure if it is the only way but in my method I called the value of an attribute via:


I couldn’t find this documented anywhere!!!



$data->attributeName should work…

It doesn’t for me.

I read a few different posts on this topic and worked out the solution although none of them put all the ingredients into a single post so I thought I would post this now for the benefit of the next person.

I want to display a different color depending on the status of an order.

Firstly I map the status (an int) to the color desired in my model as a get property :

    public function getColor() {



        switch ($this->status) {

            case 1:



            case 2:



            case 3:



            case 4:




        return $statuscolor;



Now I define styles (in my default .css file) to override the yii styles (alternate colors) for this grid. Note that I could have been a bit smarter and also overridden the odd/even color with some sort of shading but I wasnt feeling that smart. Also you could add definitions for the hover color (I might add this):


	background: #FFCCCC;



	background: #CCFF99;




	background: #FFFF99;




	background: #FFFFFF;


Now its just a matter of telling the gridview to use the styles:

            $this->widget('zii.widgets.grid.CGridView', array(













I have removed some of the detail - the interesting bit is the rowCssClassExpression - by setting that to the color property that we defined in our model we override the row color with the color as per the css.