博客园 :: 首页 :: 博问 :: 闪存 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::

引入jquery

 <?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,
      ),
  ));

?> 

来源http://guxing.info/2012/03/20/yii-jquery%E6%8A%98%E5%8F%A0%E3%80%81%E5%BC%B9%E5%AF%B9%E8%AF%9D%E6%A1%86%E3%80%81%E6%8B%96%E6%8B%BD%E3%80%81%E6%BB%91%E5%8A%A8%E6%9D%A1%E3%80%81ol%E5%92%8Cul%E5%88%97%E8%A1%A8%E3%80%81%E5%B1%80/
 

posted on 2012-04-08 20:55  Likwo  阅读(2532)  评论(2编辑  收藏  举报