[CoLT]

Somehow I can't change the specific column size in CGridView, trying:

<?php $this->widget('zii.widgets.grid.CGridView', array(
	'id'=>'course-grid',
	'dataProvider'=>$model->search(),
	'filter'=>$model,
	'columns'=>array(
...

		array(
            'name'=>'CrSun',
            'value'=>'$data->CrSun?Yii::t("App","Yes"):Yii::t("App","No")',
            'filter'=>array('0'=>Yii::t("App","No"),'1'=>Yii::t("App","Yes")),
	    'headerHtmlOptions'=>array('size'=>10), //maybe I'm missing something?
	    'htmlOptions'=>array('size'=>10),
        ),
...

        	'CrInfo',
		'CrComm',
		array(
			'class'=>'CButtonColumn',
		),
	),
)); ?>

Thanks

CoLT

[Jaz Manister]

Just use width, not size:

'columns'=>array(
  array(
    'name'=>'name',
    'value'=>'asdf',
    'htmlOptions'=>array('width'=>'40px'),
  ),

[CoLT]

Jaz Manister, on 06 May 2010 - 11:03 AM, said:

Just use width, not size:

'columns'=>array(
  array(
    'name'=>'name',
    'value'=>'asdf',
    'htmlOptions'=>array('width'=>'40px'),
  ),

Hm, that does not work too.

[Y!!]

CoLT, on 06 May 2010 - 11:40 AM, said:

Hm, that does not work too.

"px" is only for css and not for direct html attributes. Take that away and it should work.

[Jaz Manister]

Y!!, on 06 May 2010 - 11:41 AM, said:

"px" is only for css and not for direct html attributes. Take that away and it should work.

Yeah, you're right about that. But this works for me both ways.. not sure why. I tried it as 'htmlOptions'=>array('style'=>'width:80px') and that works.. but I think an even better way to do it would be just to add it to the header column and not every column via 'headerHtmlOptions'. This is sort of the quick and dirty way of doing things.

I did this other technique yesterday day by specifying a special css file for the CGridView. I'm not sure if I have the best way of doing this, because when I first did it I lost all styling, so I made a copy of the CGridView style.css file in my project css directory and then referenced the column header id with a specific width.

//grid view 
$this->widget('zii.widgets.grid.CGridView', array(
 'dataProvider'=>$dataProvider,
 'id'=>'mygridview',
 'cssFile'=>'/myapp/css/mystyle.css',


mystyle.css (complete copy of style.css from framework directory)
added the following:

#mygridview_c2 { width: 80px; }

[CoLT]

Still no effect..

In any of mentioned options column remains untouched.

CoLT

[Jaz Manister]

CoLT, on 06 May 2010 - 12:33 PM, said:

Still no effect..

In any of mentioned options column remains untouched.

CoLT

Can you see the changes coming through if you inspect with firebug? If you use the htmlOptions thing, you should see something like <th style="width:80px"> or if you went the css file, you would see it in the style area of firebug.. whatever you're using, does it show up upon inspection?

[CoLT]

Jaz Manister, on 06 May 2010 - 12:41 PM, said:

Can you see the changes coming through if you inspect with firebug? If you use the htmlOptions thing, you should see something like <th style="width:80px"> or if you went the css file, you would see it in the style area of firebug.. whatever you're using, does it show up upon inspection?

Nope, no changes at all (inspected with Firebug)

Can't find out why

[edit]
I see changes, I had commented it temporarily.

But table does not move an inch

[edit]
I noticed the GridView goes under the default borders - this is the reason why it ignores width. But I believe it still should listen to params, as other grids need to be smaller.

Any ideas?

CoLT

This post has been edited by CoLT: 06 May 2010 - 01:12 PM

[tri]

CoLT, on 06 May 2010 - 01:03 PM, said:

...
Any ideas?

CoLT

With my own (simple) grid I ended up with a row of <col> tags for better control of width and alignment. (Can't recall the reason it didn't work well with <th>, perhaps the left/right alignment or need for fixed column width.)

Not obvious how to accomplish that by extending CGridview, though.

Example

<table>
  <col class="col1"></col><col class="col2"></col>
  <tr>
  <th>header1</th><th>header1</th>
  ...

/Tommy

[sn0rcha]

Is there a way to add a url to an image type column, or have an image with a link in any of the other types of columns?.. I can not for the life of me figure out how to display an image in a column in CGridview and have it link somewhere..

Here is my column code;

        array('name'=>'Image','type'=>'image','value'=>'Yii::app()->controller->createUrl("fileReader/getImage",array("id"=>$data->photos_id,"type"=>"photos","f"=>"thumb_$data->photos_file"))'),

I've tried creating the html for a link using CHtml::link and CHtml::image in all options for the column format, but it never works...

Any ideas?

[sn0rcha]

sn0rcha, on 19 May 2010 - 01:24 AM, said:

Is there a way to add a url to an image type column, or have an image with a link in any of the other types of columns?.. I can not for the life of me figure out how to display an image in a column in CGridview and have it link somewhere..

Here is my column code;

        array('name'=>'Image','type'=>'image','value'=>'Yii::app()->controller->createUrl("fileReader/getImage",array("id"=>$data->photos_id,"type"=>"photos","f"=>"thumb_$data->photos_file"))'),

I've tried creating the html for a link using CHtml::link and CHtml::image in all options for the column format, but it never works...

Any ideas?

Doh, disregard that post.. got it working like this:

					 array('name'=>'Pic','type'=>'raw','value'=>'CHtml::link(CHtml::image(Yii::app()->controller->createUrl("fileReader/getImage",array("id"=>$data->photos_id,"type"=>"photos","f"=>"thumb_$data->photos_file"))),Yii::app()->controller->createUrl("photos/update",array("id"=>$data->photos_id)))'),

hope it helps someone.

[Komodo]

What about

htmlOptions => array('style'=>'width:40px;');

[Rafal_P]

Quote

'columns'=>array(
array(
'name'=>'name',
'value'=>'asdf',
'htmlOptions'=>array('width'=>'40'),
),

This works great for me ( its without px like say Y!!).

thanks & GL

[GSTAR]

OR how about:

.grid-view table.items th
{
	width: 40px;
}

In your custom CSS / form.css file.

[volkmar]

I had the same problem.

Try out "headerHtmlOptions" with the same configuration such like htmlOptions!!!
That works!

[diggy]

Komodo, on 19 May 2010 - 05:15 PM, said:

What about

htmlOptions => array('style'=>'width:40px;');

This could work. I have use mostly this way to change size of columns.

[fouss]

diggy, on 20 October 2010 - 03:04 PM, said:

This could work. I have use mostly this way to change size of columns.

I tryed all th method listed here but any is working width my CGridView

[fouss]

fouss, on 03 February 2011 - 11:20 AM, said:

I tryed all th method listed here but any is working width my CGridView

Any idea?

[GoorooTech]

fouss, on 07 February 2011 - 06:27 AM, said:

Any idea?

I also was trying to control button column widths etc via CSS and found I also had similar troubles to the above posts. I found out a few things that stopped my custom CSS from working.

1/ make sure your path is correct in the cssFile parameter!! (as mentioned in previous posts!)

2/ Multiple cgridviews in the same view - I found I had to set ALL cgridviews to my custom CSS otherwise I would get the situation that the default styles.css would be loaded as well as my custom CSS (ie. 'gridview.css') but styles.css would take precedence over my custom gridview.css and thus would never show my changed style.

$this->widget('zii.widgets.grid.CGridView', array(
		'dataProvider'=>$jobs,
		'cssFile'=>'/jobsys/css/gridview.css',
		'columns'=>array(
					'id',
...

Hope it helps people!

[wsmits]

I think the problem is with the filter text boxes.
I have a similar problem in my gridview.

'id'=>'user-grid',
      'showSummary'=>false,
      'dataProvider'=>$model->search(),
      'cssFile' => Yii::app()->theme->baseUrl . '/css/gridView.css',
      'filter'=>$model,
      'emptyText' => 'Nog geen gebruikers aangemaakt',
      'columns'=>array(
         array(
          'name'=>'id',
          'htmlOptions'=>array('width'=>'40'),
        ),
        'first_name',
        'last_name',
        'email',

As you can see, I have added

'htmlOptions'=>array('width'=>'40'),

to the ID column. This doesn't seem to work because the text boxes in the filter row are not getting a smaller size.

When I remove

 'filter'=>$model,

then the resizing works well.

I need to figure out how to add a class to each individual filter textbox to let this resizing work.