Readmore link in GridView

Question

I am using gridview to display a set of data. Everything works fine except I don't have any clue on how to implement a read more link within the gridview. Below is the code for the view, I am using Yiibooster TbGridView, but code should be almost identical for CGridview too.

<?php $this->widget('bootstrap.widgets.TbGridView', array(
    'dataProvider'=>$dataProvider,
    'columns'=>array(
         'startdate'
         'status',
          'description',
         array(
        'htmlOptions' => array('nowrap'=>'nowrap'),
        'class'=>'bootstrap.widgets.TbButtonColumn',
        'template' => '{view},{update}',
            'viewButtonUrl'=>'Yii::app()->createUrl("status/view",$params=array("id"=>$data["id"]))',
            'updateButtonUrl'=>'Yii::app()->createUrl("status/update",$params=array("id"=>$data["id"]))',
    )
    )))
    ?>

Here, I don't want to display the complete description, but a substring of it and along with that a button called 'read more' which the user can click to display the whole 'description'. Any ideas on how to implement it?

score 2 · Accepted Answer · answered Sep 11 '13 at 20:03

<?php $this->widget('bootstrap.widgets.TbGridView', array(
'dataProvider'=>$dataProvider,
'columns'=>array(
     'startdate'
     'status',
      array(
            'name' => 'description'
            'value' => 'substr($data->description,0,100)."...<div class=more-data>$data->description</div><a href=javascript:void(0); id=readMore>Read More</a>',
            'type' => 'raw',
        ),
     array(
    'htmlOptions' => array('nowrap'=>'nowrap'),
    'class'=>'bootstrap.widgets.TbButtonColumn',
    'template' => '{view},{update}',
        'viewButtonUrl'=>'Yii::app()->createUrl("status/view",$params=array("id"=>$data["id"]))',
        'updateButtonUrl'=>'Yii::app()->createUrl("status/update",$params=array("id"=>$data["id"]))',
)
)))
?>

Don't worry about quotes around html tags properties. it will be added in browser automatically. after that do some css tweaks

<style type='text/css'>
 .more-data{ display:none}
</style>

then with jquery on click on that anchor tag named read more you can make display block for this div or can put any effect you want.

Might it will help you

score 1 · Answer 2 · edited Jan 14 '14 at 11:41

try this

<?php $this->widget('bootstrap.widgets.TbGridView', array(
'dataProvider'=>$dataProvider,
'columns'=>array(
     'startdate'
     'status',
     array(
                'value' => 'Model::function($data->description)',
                'type' => 'raw',
                'name' => 'description'
            ),
     array(
    'htmlOptions' => array('nowrap'=>'nowrap'),
    'class'=>'bootstrap.widgets.TbButtonColumn',
    'template' => '{view},{update}',
        'viewButtonUrl'=>'Yii::app()->createUrl("status/view",$params=array("id"=>$data["id"]))',
        'updateButtonUrl'=>'Yii::app()->createUrl("status/update",$params=array("id"=>$data["id"]))',
)
)))
?>

change Model with name of a model and function with a function in that model and pass appropriate parameters.

then in that function use substr() and add a link to the page where full description is available and return whole string

Readmore link in GridView

2 Answers2