Colorbox Extension (Jcolorbox): Problem With Grid Ajax Calls Within Colorbox, It Posts Back

Yii 1.1 General Discussion
1

I have used a colorbox extension to display a grid which renders through a separate view. Following is a link code to open colorbox popup:




<?php echo CHtml::link("Log link", array("forecast/log", "id"=>"51"), array("class"=>"smallButton colorBox")); ?>

Following is the code how I bind the colorbox with link:




//Create an instance of ColorBox

$colorbox = $this->widget('application.extensions.colorpowered.JColorBox');

//Call addInstance (chainable) from the widget generated.

$colorbox->addInstance('.colorBox', array('maxHeight'=>'80%', 'maxWidth'=>'90%'));

Action "forecast/log" partially renders a view which contains a grid widget. Following is the log view code




<?php

$this->pageHeading = 'Log';

?>

<div id="page_grid_unit">

    <?php

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

        'id'=>'grdProjectionsLog',

        'dataProvider'=>$dataProvider,

        'template'=>'{items}{summary}',

        'cssFile' => Yii::app()->baseUrl . '/css/grid/gridView.css',

        'htmlOptions' => array('style' => 'width:99%;'),

        'columns'=>array(

            array(

                'header' => 'Company',

                'name'=>'company.name',

                'headerHtmlOptions'=>array('style'=>'width:300px;'),

            ),

            array(

                'name'=>'modified_at',

            ),

        ),

    ));

    ?>

</div>

Problem:

The colorbox works perfectly fine to show the grid within itself but when we sort the grid which triggers a ajax call to load it again, the page is completely post back and grid does not being refreshed within colorbox.

2

Fixed (Solution):

This is achieved by setting iframe property of colorbox to true. Following is the code:




$colorbox->addInstance('.colorBox', array('iframe'=>true, 'width'=>'80%', 'height'=>'80%'));

// Just set iframe property to true