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

<?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();returnfalse;}',

)

);

?>

<?php

//谈对话框

$this->beginWidget('zii.widgets.jui.CJuiDialog',array(

'id'=>'mydialog',

//additionaljavascriptoptionsforthedialogplugin

'options'=>array(

'title'=>'对话框',

'autoOpen'=>false,

),

));

//输出弹出框的内容

//echo$this->renderPartial('_form',null,true);

$this->endWidget('zii.widget.jui.CJuiDialog');

//打开对话框的链接

echoCHtml::link('登录','#',array(

'onclick'=>'$("#mydialog").dialog("open");returnfalse;',

));

?>

<?php

//拖拽

$this->beginWidget('zii.widgets.jui.CJuiDraggable',array(

//additionaljavascriptoptionsforthedraggableplugin

'options'=>array(

'scope'=>'myScope',

),

));

echo'拖拽的内容！';

$this->endWidget();

?>

<?php

//ol列表

$this->widget('zii.widgets.jui.CJuiSelectable',array(

'items'=>array(

'id1'=>'Item1',

'id2'=>'Item2',

'id3'=>'Item3',

),

//additionaljavascriptoptionsfortheselectableplugin

'options'=>array(

'delay'=>'300',

),

));

//ul列表

$this->widget('zii.widgets.jui.CJuiSortable',array(

'items'=>array(

'id1'=>'Item1',

'id2'=>'Item2',

'id3'=>'Item3',

),

//additionaljavascriptoptionsfortheaccordionplugin

'options'=>array(

'delay'=>'300',

),

));

?>

<?php

//滑动条

$this->widget('zii.widgets.jui.CJuiSlider',array(

'value'=>37,

//additionaljavascriptoptionsforthesliderplugin

'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),//渲染一个页面

//panel3containsthecontentrenderedbyapartialview

//'AjaxTab'=>array('ajax'=>$ajaxUrl),

),

//additionaljavascriptoptionsforthetabsplugin

'options'=>array(

'collapsible'=>true,

),

));

?>