I have a problem with GridView in my project. I'm developing a Yii application and using standard zii grid view in different views of my project. my problem is to find a way to change their CSS styles from one place in my project.I realy dont want to change it view by view. is there any suggestion to do this?
4 Answers
For global settings you can edit the application configuration file main.php like this:
return array( … 'components'=>array( 'widgetFactory'=>array( 'widgets'=>array( 'CGridView'=>array( 'cssFile' => Yii::app()->request->baseUrl.'/css/gridview.css',, ), 
I just wanted to add a snippet which stops it loading all together. Added to the components array in main config. This is available since 1.1.3
//stop zii loading css 'widgetFactory'=>array( 'widgets'=>array( 'CGridView'=>array( 'cssFile' => FALSE, ), ), ), Or load a specific stylesheet
//stop zii loading css and load a specific stylesheet 'widgetFactory'=>array( 'widgets'=>array( 'CGridView'=>array( 'cssFile' => Yii::app()->request->baseUrl.'/css/gridview.css', ), ), ), 
Comments
To change it per view (I know you said you don't want to, but here it is anyway for anyone who may be searching) is to change the cssFile property of the CGridView instance like so:
<?php $this->widget('zii.widgets.grid.CGridView', array( 'id' => 'user-grid', 'dataProvider' => $model->search(), 'filter' => $model, 'ajaxUpdate' => false, 'cssFile' => Yii::app()->request->baseUrl.'/css/gridview.css', ... I the above example we are using a CSS file called gridview.css instead of the default CSS file.
To change it globally (across all instances of CGridView) you can either overwrite the CSS attributes of the gridview manually in one of your CSS files (keep in mind the load order of the files, you may need to use !important)
OR
You can simply edit the framework asset for the gridview which is located at:
framework/zii/widgets/assets/gridview/styles.css 
2 Comments
BlackHatSamurai
You should never change the files in the
assets folder. If you were to ever change the file path, these files would be reset. It is better to use the first option.
Brett Gregson
@Blaine You are thinking of the assets folder in the root folder where temp assets are stored. The above is a reference to the assets folder within the framework, which has a static path
after searching alot about this issue I couldn't find any good and standard solution for that. so I've used an unusual and maybe not standard way to solve that and put it here for someone who may face my problem too.
the idea is that when you use zii yii grid view,by default, during the runtime it send a request to get its appropriate CSS files so in controller I do not let it to get it's original files by using this code :
Yii::app()->clientScript->scriptMap = array( 'pager.css' => false, 'styles.css' => false, ); the point is that this code prevent all rquests to all styles.css file which you may have in the project. so be carefull about that.
the next thing I did was to change the request to sytles.css and pager.css files. I defined two custom css files named gridStyle.css and pager.css and use them instead of these two original files. so by the following code I used some mapping for that :
Yii::app()->clientScript->scriptMap = array( 'pager.css' => Yii::app()->theme->baseUrl . '/css/pager.css', 'styles.css' => Yii::app()->theme->baseUrl . '/css/gridStyle.css', ); by this code I said that if there is a request to styles.css and pager.css files replace them with my custom files.As I said maybe it's not a well solution but it was the only solution for me.
1 Comment
bool.dev
even though there's nothing wrong with your solution(and you should use whatever feels right for you), it's definitely not the "yii way". The
widgetFactory can be used for exactly this purpose, see the other answer.
path/to/framework/zii/widgets/assets/gridview/styles.cssfile.rowCssClassand other css specific properties of CGridView? or something else? sample?