yii jquery折叠、弹对话框、拖拽、滑动条、ol和ul列表、局部内容切换

转载：http://www.cnblogs.com/thinksasa/archive/2014/07/05/3825624.html

<?php Yii::app()->clientScript->registerCoreScript('jquery');?>
<?php
//yii折叠效果（CJuiAccordion）
$this->widget('zii.widgets.jui.CJuiAccordion', array(
     'panels'=>array(
         '分类1'=>'分类1的内容',
         '分类2'=>'分类2的内容',
         // 分类可以渲染一个页面，例如分类3
         //'分类3'=>$this->renderPartial('_partial',null,true),
     ),
     'options'=>array(
         'animated'=>'bounceslide',
     ),
 ));
?>
 
<?php
//按钮加js弹框提示
  $this->widget('zii.widgets.jui.CJuiButton',
        array(
            'name'=>'button',
            'caption'=>'提交',
            'value'=>'asd',
            'onclick'=>'js:function(){alert("提交成功！"); this.blur(); return false;}',
        )
  );
?>
 
<?php
//谈对话框
$this->beginWidget('zii.widgets.jui.CJuiDialog', array(
  'id'=>'mydialog',
  // additional javascript options for the dialog plugin
  'options'=>array(
    'title'=>'对话框',
    'autoOpen'=>false,
  ),
));
    //输出弹出框的内容
    //echo $this->renderPartial('_form',null,true);
 
$this->endWidget('zii.widget.jui.CJuiDialog');
 
//打开对话框的链接
echo CHtml::link('登录', '#', array(
 'onclick'=>'$("#mydialog").dialog("open"); return false;',
));
?>
 
<?php
//拖拽
 $this->beginWidget('zii.widgets.jui.CJuiDraggable', array(
     // additional javascript options for the draggable plugin
     'options'=>array(
         'scope'=>'myScope',
     ),
 ));
     echo '拖拽的内容！';
 $this->endWidget();
?>
 
<?php
//ol列表
  $this->widget('zii.widgets.jui.CJuiSelectable', array(
      'items'=>array(
          'id1'=>'Item 1',
          'id2'=>'Item 2',
          'id3'=>'Item 3',
      ),
      // additional javascript options for the selectable plugin
      'options'=>array(
          'delay'=>'300',
      ),
  ));
//ul列表
  $this->widget('zii.widgets.jui.CJuiSortable', array(
      'items'=>array(
          'id1'=>'Item 1',
          'id2'=>'Item 2',
          'id3'=>'Item 3',
      ),
      // additional javascript options for the accordion plugin
      'options'=>array(
          'delay'=>'300',
      ),
  ));
?>
 
<?php
//滑动条
  $this->widget('zii.widgets.jui.CJuiSlider', array(
      'value'=>37,
      // additional javascript options for the slider plugin
      'options'=>array(
          'min'=>10,
          'max'=>50,
      ),
      'htmlOptions'=>array(
          'style'=>'height:20px;'
      ),
  ));
?>
 
<?php
//局部内容切换
  $this->widget('zii.widgets.jui.CJuiTabs', array(
      'tabs'=>array(
          '分类1'=>'分类1',
          '分类2'=>array('content'=>'分类2', 'id'=>'tab2'),
          //'分类3'=>$this->render('_form',null,true),//渲染一个页面
          // 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,
      ),
  ));
?>