I have a table with more than 5 columns , i want to hide some columns so that those column's are shown only if some row is selected or its expanded .
Am using yiiframework's CGridView , so how can i do this in that ?
Any help is appreciable ..
I want a feature like this, so that on expanding a particular record i can see the hidden column values
'columns'=>array(
array(
'name'=>'columnName',
'htmlOptions' => array('style' => 'display:none;'),
'headerHtmlOptions'=>array('style' => 'display:none;'),
'filterHtmlOptions'=>array('style' => 'display:none;'),
),
...
One way is :
'columns'=>array(
array(
'name'=>'columnName',
'visible'=>false
),
)
So you need to manipulate visibility attributes dynamically :
'visible'=>$this->checkVisible() //custom function
sth like this depending on your requirement
example :views/user/admin.php
.....
.....
<?php
$toggleUDetails = <<<JS
$('a.toggle').live('click',function(e){
e.preventDefault();
if(this.href.split('#')[1]=='loaded') return $(this).closest("tr").next('tr.toggle').toggle();
trow=$(this).closest("tr");
var ajaxOpts={type:"POST", url:this.href ,dataType:'json',success:function(data){
$(trow).after(data.row);
}
};
this.href=this.href+'#loaded';
$.ajax(ajaxOpts);
});
JS;
Yii::app()->clientScript->registerScript('toggleUD', $toggleUDetails, CClientScript::POS_READY);
$this->widget('zii.widgets.grid.CGridView', array(
'id'=>'user-grid',
'dataProvider'=>$model->search(),
'filter'=>$model,
'columns'=>array(
array(
'class'=>'CButtonColumn',
'header'=>'Toggle Details',
'template'=>'{toggle}',
'buttons'=>array(
'toggle'=>array(
'label'=>'Details',
'imageUrl'=>Yii::app()->request->baseUrl.'/images/expand.png',
'url'=>'Yii::app()->createUrl("user/getExtra", array("id"=>$data->id))',
'options'=>array('class'=>'toggle',
),
),
),
),
'id',
'username',
'password',
'email',
array(
'class'=>'CButtonColumn',
),
),
)); ?>
public function actionGetExtra($id){
$model=User::model()->findByPk($id);
echo json_encode(array('row'=> '<tr class="toggle"><td colspan="6">'. $model->username.'</td></tr>'));
}
Enable access rights:
array('allow', // allow authenticated user to perform 'create' and 'update' actions
'actions'=>array('create','update','getExtra'),
'users'=>array('@'),
),
that much I can do you for . Remember to change the Java script function to toggle the image icon I have not done that
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With