博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
yii jquery折叠、弹对话框、拖拽、滑动条、ol和ul列表、局部内容切换
阅读量:5228 次
发布时间:2019-06-14

本文共 2331 字,大约阅读时间需要 7 分钟。

引入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,
      
),
  
));

?> 

来源

 

转载于:https://www.cnblogs.com/likwo/archive/2012/04/08/2437981.html

你可能感兴趣的文章
codility上的练习(5)
查看>>
Java开发工程师(Web方向) - 03.数据库开发 - 第4章.事务
查看>>
spring boot约定优于配置的这种做法在如今越来越流行了
查看>>
搭建 LNMP 环境
查看>>
【剑指offer】九,链表中倒数第k个结点
查看>>
最大流——poj1459
查看>>
第七次java作业
查看>>
启用sqlserver2005快照隔离
查看>>
回文串---Palindrome
查看>>
三角形问题
查看>>
Centos7.x Docker桥接网络
查看>>
RedisLive监控工具 windows部署笔记
查看>>
[Codeforces 316E3]Summer Homework(线段树+斐波那契数列)
查看>>
搭建好LAMP架构,部署OwnCloud
查看>>
EasyUI-EasyUI框架入门学习
查看>>
django新建站点时的问题
查看>>
高性能网站优化——请求响应原理
查看>>
Spring3 + Spring MVC+ Mybatis 3+Mysql 项目整合
查看>>
Android 中的MVC MVP MVVM
查看>>
Oracle练习题(1~19)
查看>>