$this->widget('zii.widgets.jui.CJuiTabs', array( 'tabs' => array( 'StaticTab 1' => 'Content for tab 1', 'StaticTab 2' => array('content' => 'Content for tab 2', 'id' => 'tab2'), // panel 3 contains the content rendered by a partial view 'AjaxTab' => array('ajax' => $this->createUrl('...')), ), // additional javascript options for the tabs plugin 'options' => array( 'collapsible' => true, ), ));
Format 2:Content Using Render Method
$this->widget('zii.widgets.jui.CJuiTabs', array( 'tabs' => array( 'StaticTab 1' => 'Content for tab 1', 'StaticTab 2' => array('content' => 'Content for tab 2', 'id' => 'tab2'), // panel 3 contains the content rendered by a partial view 'AjaxTab' => array('ajax' => $this->createUrl('..')), [color="#FF0000"]// Get Content From Another page. Also Pass Parameter[/color] 'Render View'=>$this->renderPartial('_newpage', array('value'=>$value), TRUE )), ), // additional javascript options for the tabs plugin 'options' => array( 'collapsible' => true, ), // set id for this widgets 'id'=>'MyTab', ));
Format 3:Content Using Render Method And Set Id For Each Single Tab
$this->widget('zii.widgets.jui.CJuiTabs', array( 'tabs' => array( 'StaticTab 1' => 'Content for tab 1', 'StaticTab 2' => array('content' => 'Content for tab 2', 'id' => 'tab2'), // panel 3 contains the content rendered by a partial view 'AjaxTab' => array('ajax' => $this->createUrl('..')), 'Render View'=>array('id'=>'renderid', 'content'=>$this->renderPartial( '_newpage', array('value'=>$value),TRUE) ), ), // additional javascript options for the tabs plugin 'options' => array( 'collapsible' => true, ), // set id for this widgets 'id'=>'MyTab', ));
Dynamic CJuiTabs
$tab_list=Componenttabs::gettabs(); $tabarray=array(); $i=1; foreach ($tab_list as $key=>$value){ $tabarray["Tab $i"]=array('id'=>$i, 'content'=>$this->renderPartial( '_newpage', array('value'=>$value), TRUE) ); $i++; } $this->widget('zii.widgets.jui.CJuiTabs', array( 'tabs'=> $tabarray, /*array( 'StaticTab 1'=>'Content for tab 1', 'StaticTab 2'=>array('content'=>'Content for tab 2', 'id'=>'tab2'), // panel 3 contains the content rendered by a partial view //'AjaxTab'=>array('ajax'=>$ajaxUrl), ),*/ // additional javascript options for the tabs plugin 'options'=>array( 'collapsible'=>true, ), 'id'=>'categorytabs', ));
Hint
When you use more than one CJuiTabs "Dont Forget" to set "ID".
Otherwise you will get some problem