Hey guys, today we will show you how to make a Yii CJuitabs as example. Some feature cases such as Static tabs, render partial tabs, Ajax tabs, color tabs... You can see our code, there are simple 3 steps to make it work.

Note:

• Working for Yiiframework version 1.x

In view.php ¶

<h1>Default CJuiTabs: Static, render partial, Ajax tab</h1>
<?php
$this->widget('zii.widgets.jui.CJuiTabs',array(
    'tabs'=>array(
        'StaticTab '=>'Content for tab 1',
        'StaticTab With ID'=>array('content'=>'Content for tab 2 With Id' , 'id'=>'tab2'),
        'Render Partial'=>array('id'=>'test-id','content'=>$this->renderPartial(
										'_renderpage',
										array('Values'=>'This Is My Renderpartial Page'),TRUE
										)),        
        // panel 3 contains the content rendered by a partial view
        'AjaxTab'=>array('ajax'=>$this->createUrl('ajax')),
    ),
    // additional javascript options for the tabs plugin
    'options'=>array(
        'collapsible'=>true,
    ),
    'id'=>'MyTab-Menu',
));
?>

<br />
<h1>Dynamic Yii CJui Tabs Menu With Color </h1>
<?php
$tablist=array("Red","Green","Blue");
foreach($tablist as $tabs){
    $css='';
		if($tabs=='Red'){$css='color:red;';}
		else if($tabs=='Green'){$css='color:green;';}
		else if($tabs=='Blue'){$css='color:blue';}	
		$tabarray["<span id='tab-$tabs' style='$css'>$tabs</span>"]="$tabs Color";
}
?>
<?php
$this->widget('zii.widgets.jui.CJuiTabs',array(
    'tabs'=>$tabarray,
    // additional javascript options for the accordion plugin
    'options' => array(
        'collapsible' => true,        
    ),
    'id'=>'MyTab-Menu1'
));
?>

<br />
<h1>Yii CJui Tabs Mouse Over Event </h1>
 <?php
$this->widget('zii.widgets.jui.CJuiTabs',array(
    'tabs'=>$tabarray,
    // additional javascript options for the accordion plugin
    'options' => array(         
        'event'=>'mouseover',
    ),
    'id'=>'MyTab-Menu-Mouse'
));
?>

in ajax.php file: ¶

/ ajax.php /

<?php
    echo "Ajax Rendered This Page"; 
   //Your processing   
?>

In _renderpage.php ¶

/** _renderpage.php **/
<?php
    echo $Values."<br/>";
    echo "Render Page<br/>";
    
?>

Screenshots:

Reference: http://www.codexamples.com/95/yii-cjui-tabs/