How to change GridView column size in YII? - php

Im trying change my GridView column width. This is my code:
<?php $this->widget('zii.widgets.grid.CGridView', array(
'id' => 'prefixs-grid',
'dataProvider' => $model->search(),
'filter' => $model,
'columns' => array(
array(
'name' => 'id',
'header' => 'No.',
'htmlOptions' => array('class' => 'center'),
),
array(
'name' => 'pfx',
'htmlOptions' => array('width' => 30),
),
array(
'class' => 'CButtonColumn',
),
),
)); ?>
When i run 'pfx' columns width must be changed to 30, but width is same. How i can change width of column? Any ideas?

If you do not want to use a separated CSS definition you should do:
'htmlOptions' => array('style' => 'width: 30px;'),
'filterHtmlOptions' => array('style' => 'width: 30px;'),

'columns' => [
[
'headerOptions' => ['width' => '150'],
'attribute' => 'name',
'format' => 'raw',
'value' => 'name'
],
]

There are multiple ways to approach this issue.
You can widen the cell's contents (cells of individual rows):
$columns[] = array(
'header'=>'Name',
'value'=>'$data["name"]',
'htmlOptions'=>array('style'=>'width: 150px')
);
Sometimes you may want to widen the column header instead of the individual rows' cells:
$columns[] = array(
'header'=>'Name',
'value'=>'$data["name"]',
'headerHtmlOptions'=>array('style'=>'width: 150px')
);
Widening the header is the preferred option, but even if you do that, sometimes it doesn't work as expected.
If this is the case, you can go my personal preferred way and widen the contents of the header cell. The widening will be inherited by the rows below it as well.
$columns[] = array(
'header'=>'<div style="width:150px;">Name</div>',
'value'=>'$data["name"]',
);

i noticed with cgridview in the tags there is an id attribute id="table-name_c0" id="table-name_c1" etc. you could hook into this and the .filters class for the filter width. e.g.
#table-name table-name_c0 {
width: 30px;
}
#table-name .filters:nth(0) {
width:30px;
}
where c0 and :nth(0) are the same number.
it's slightly hacky but what you are trying to achieve is also slightly hacky imho

Simply add
'contentOptions' =>['style' => 'width:30px'],
-- For example:
'columns' => [
[
'attribute' => 'product.name',
'contentOptions' =>['style' => 'width:30px'],
],
That should do the trick!

Related

change id checkboxs in CGridView

there are 2 columns check box in cgridViewtable and two bootstrap widgets TbButton in view page.
I can not get value of my checkbox very good. My value in checkboxs transfer into controller but changed id of checkboxs After a period of timeand , and controller don't knew checkbox,
View:
$form = $this->beginWidget('bootstrap.widgets.TbActiveForm', array(
'id' => 'profile-information-form',
'enableAjaxValidation' => false,
));
$this->widget('bootstrap.widgets.TbButton', array('buttonType' => 'submit', 'type' => 'primary', 'label' => Yii::t('fa_ir', 'First validation'),));
$this->widget('bootstrap.widgets.TbButton', array('buttonType' => 'submit', 'type' => 'primary', 'label' => Yii::t('fa_ir', 'End validation'),));
$this->widget('zii.widgets.grid.CGridView', array(
'id' => 'profile-information-grid',
'dataProvider' => $model->children(),
'filter' => $model,
'columns' => array(
array(
'header' => '',
'value' => '$this->grid->dataProvider->pagination->offset + $row+1', // row is zero based
),
array(
'name' => 'ProfileInformation.user.scope',
'value' => 'CHtml::encode($data->user->scope->name)',
'filter' => Scope::model()->options,
),
array(
'name' => 'id',
'value' => 'CHtml::encode($data->id)',
),
array(
'name' => 'center',
'value' => 'CHtml::encode($data->center)',
),
array(
'name' => 'sendCount',
'value' => 'CHtml::encode($data->sendCount)',
'filter' => '',
),
// Use CCheckbox column with selectableRows = 2 for Select All
array('class' => 'CCheckBoxColumn', 'selectableRows' => 2, 'visible' => (Lookup::isUser2(Yii::app()->user->id) or Lookup::isAdmin(Yii::app()->user->id))),
array('class' => 'CCheckBoxColumn', 'selectableRows' => 2, 'visible' => (Lookup::isUser1(Yii::app()->user->id) or Lookup::isAdmin(Yii::app()->user->id))),
),
));
// action button
$this->endWidget();
Controller:
if (isset($_POST['profile-information-grid_c10']) & isset($_POST['yt0'])) {
////Do action1
}
if (isset($_POST['profile-information-grid_c12']) & isset($_POST['yt1'])) {
////Do action2
}
}
my problem is in $_POST['profile-information-grid_c10'] and _POST['profile-information-grid_c12'] , before id were $_POST['profile-information-grid_c8'] and $_POST['profile-information-grid_c10'] , and now is $_POST['profile-information-grid_c12'] and $_POST['profile-information-grid_c14'].
my problem is very involved. I cannot explain very good.
I want to have a fix id.
I donto why change id of check box?
Can I assign ids for checkboxs?
Can I assign ids for checkboxs? Sure, you better explicitly set checkbox column id:
'class' => 'CCheckBoxColumn', 'id'=>'column1', ... see these docs.
This way you firmly set it and you'll have no things like these yt0, yt2...
The same you can do for the buttons. See TButton docs.
Also you need to use double && in logical condition:
isset($_POST['profile-information-grid_c12']) & isset($_POST['yt1'])

sort column by date TbJSONGridView

I want to sort a column in TbJSONGridView by date , I have this code
$this->widget(
'bootstrap.widgets.TbJsonGridView', array(
'dataProvider' => $model->searchPending(),
'type' => 'striped bordered condensed',
'summaryText' => false,
'cacheTTL' => 10, // cache will be stored 10 seconds (see cacheTTLType)
'cacheTTLType' => 's', // type can be of seconds, minutes or hours
'enablePagination' => true,
'columns' => array(
array(
'name' => 'Pickup Date',
'value' => '$data->carShippeds[0]->pickup_date',
'type'=>'date',
),
))
but the column I get it is from a related model, and the sorting is not working, when I clicked on the column header it does nothing.
what's wrong with the code???
Gabriel
$data->carShippeds[0]->
This shows us that the current model has many cars shipped. You are only showing the first one in there. While that works, Yii has no way of knowing that you are only showing the first value so your sorting has no chance of working. Create a view that only selects your first pickup date, make a join in your criteria with the main model, show the field without [0]-> and it will work.
Change the below section:
array(
'name' => 'Pickup Date',
'value' => '$data->carShippeds[0]->pickup_date',
'type'=>'date',
),
To this:
array(
'name' => 'pickup_date',
'header' => 'Pickup Date',
'value' => '$data->carShippeds[0]->pickup_date',
'type'=>'date',
),
Then in your 'form' when you want to return DataProvider write the specific sorting code for this association like below:
return new DataProvider($query, [
'pagination' => [
'pagesize' => 20,
],
'sort' => [
'sortVar' => 'sort',
'defaultOrder' => ['t.carShippeds.pickup_date asc'],
'attributes' => [
'pickup_date' => [
'asc' => 't.carShippeds.pickup_date',
'desc' => 't.carShippeds.pickup_date DESC',
],
'*',
],
],
]);
Please notice that I did not know the join alias you have for your t.carShippeds or even whether it is t or another entity. replace it or give me more information about your DataProvider and I can help more.

How to Disable Button on CButtonColumn Table

I want to disable the update button from CGridView Table. I don't know how to do it. Just disable the update button, not delete the function of update. Anybody know how to do it? Thanks
'columns' => array(
// All your columns here
// ...
array(
'template' => '{view}{delete}',
'class' => 'CButtonColumn',
),
),
It's enough :)
EDIT: above solution removes the button. The following disable it (by removing the link):
'columns' => array(
// All your columns here
// ...
array(
'template' => '{view}{update}{delete}',
'class' => 'CButtonColumn',
'buttons' => array(
'update' => array(
'url' => ''
),
),
),
You have to change the 'template' property of your CButtonColumn.
The default value for 'template' is '{update}{view}{delete}'.
So you have to do this:
array(
'class' => 'CButtonColumn',
'template' => '{view}{delete}',
),

Yii CDetailView translate sub-property

<?php
$this->widget('zii.widgets.CDetailView', array(
'data' => $model,
'htmlOptions' => array('style' => 'width:425px; float:left; margin-right:20px; word-break:break-all', 'class' => 'detail-view table table-striped table-condensed'),
'attributes' => array(
'id',
'name',
'street',
'housenumber',
'zipcode',
'city',
array(
'label' => Yii::t('api', 'Country'),
'name' => Yii::t('api', 'country.name'),
),
),
));
?>
I want to translate the values for the attributes label and name in the array for the columns.
But it only translate the label and not the name.
Can someone tell me, what I am doing wrong?
name is the column name in the database, I think you want to adjust value, try this:
'label' => Yii::t('api', 'Country'),
'name' => 'country.name', //in reality you don't need this since you are setting the value
'value' => Yii::t('api', $model->country->name),

Yii Booster - td cell height when contains progress bar

I'm creating app with Yii and YiiBooster. When I put a TbProgress widget into a td cell - it's height seems to have some kind of bottom padding (like 20-30px). It looks pretty bad as it causes my table rows to be higher than they should.
There was a margin-bottom defined to 40px (in bootstrap.css file) but I removed it - it is still to high.
Anyone knows where can I change it?
Here is my code:
$this->widget('bootstrap.widgets.TbGridView', array(
'id' => 'invite-grid',
'type' => 'striped condensed',
'dataProvider' => $dataProvider,
'columns' => array(
'idProject',
'name',
array(
'header' => 'Postęp',
'value' => function($data)
{
Controller::widget('bootstrap.widgets.TbProgress', array(
'percent' => ($data->projectInvites +1 )/ $data->projectMaxInvites * 100,
));
},
'htmlOptions' => array (
'style' => ''
),
),
array(
'class' => 'bootstrap.widgets.TbButtonColumn'
)
)
));
you can define margin-bottom:0 !important; to any css file inside your page to the class of that element.
Did you clear the asset directory after change bootsrap.css, you must if you want to changes to affect. May be that was the problem.
Look for padding to parent element or the same element of, may be there is padding not margin.
I have found the solution. I had to add `margin-bottom: -20px' to the code:
Controller::widget('bootstrap.widgets.TbProgress', array(
'percent' => $data->projectInvites == 0 ? 0 :
($data->projectConfirms / $data->projectInvites) * 100,
'htmlOptions' => array(
'style' => 'height: 20px; margin-bottom: -20px',
),
));

Categories