Social Icons

Pages

Monday, January 14, 2013

CJuiTabs Content

When I used CJuiTabs I did something. They are 1. Direct Content for tab 2. Append content Using Ajax 3. Tab with ID and Id For every single tab of CJuitab 4. Content Using renderPartial Method 5. Dynamic Tab menu from database I post code below. It was very userful for me.

Format 1:Basic

$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('..')),
 // Get Content From Another page. Also Pass Parameter
        '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',
));



for reference please go through this link cjuitabs