Display Bigger Image In Pop Up On Click Image In Cgridview

Hello Friends,

I am newbie in yii framework and facing some issue.

I am displaying the images stored in database in CGridView using below code snippet.

//admin.php

<?php

$this->widget('zii.widgets.grid.CGridView', array(

    'id' => 'adverts-grid',

    'dataProvider' => $model->search(),

    'filter' => $model,

    'columns' => array(

             array('name'=>'adimage1','type'=>'raw','value'=>array($this,'getImage1')),  


        array(

            'class' => 'CButtonColumn',

        ),

    ),

));

?>


//controller.php

public function getImage1($data, $row) {

        if ($data->adimage1 != null)

        return CHtml::image($data->adimage1, '', array('style' => 'width:40px;height:40px;',));

}

I want to display an Image in pop up with close button when user click on image thumbnail displaying in CGridView.

Guys could you please help me out to implement this.

Thanks a lot!

Call getImage1 function in ‘’, pass image value and put that function in this view itself.

function getImage1($imageVal) {

        if ($imageVal != null)

        return CHtml::image($imageVal, '', array('style' => 'width:40px;height:40px;',));

}

$this->widget('zii.widgets.grid.CGridView', array(

    'id' => 'adverts-grid',

    'dataProvider' => $model->search(),

    'filter' => $model,

    'columns' => array(

           array('name'=>'adimage1','type'=>'raw','value'=>'getImage1($data->adimage1)', 


        array(

            'class' => 'CButtonColumn',

        ),

    ),

));

Hi Absar,

Thanks for your reply, But its not working for me.

Hello Pranay,

What ever expression you write in grid view should be written as a string Absar has corrected it,

array('name'=>'adimage1','type'=>'raw','value'=>'getImage1($data->adimage1)', 

for you to have a popup for thumbnai you should put the image in a anchor tag so modified get image function looks like this

function getImage1($imageVal) {

        if ($imageVal != null)

        return ;

        CHtml::link(CHtml::image($imageVal, '', array('style' => 'width:40px;height:40px;',)), 

CController::createUrl(sampleController/popUpImage, array("img"=>$imageVal)), 

array("rel"=>"ad"));

}

/* you can use fancy box widget for popup */

$this->widget('application.extensions.fancybox.EFancyBox', array(

    'target'=>'a[rel=ad]',

    'config'=>array(),

    )

one thing you must specify the correct path for the image src try it first with a plain html img tag with satatic values.

for image pop up controller action use ($this->renderPartial(’_image’), array(‘img’=> $imageVal)) renderPartial the view, in that view again image tag with correct img src will render the image.