Chinaunix首页 | 论坛 | 博客
  • 博客访问: 245290
  • 博文数量: 62
  • 博客积分: 1350
  • 博客等级: 中尉
  • 技术积分: 457
  • 用 户 组: 普通用户
  • 注册时间: 2006-09-13 09:56
文章分类

全部博文(62)

文章存档

2016年(1)

2013年(9)

2012年(18)

2011年(31)

2010年(1)

2006年(2)

分类: 系统运维

2012-12-11 09:51:59

CGridView是Yii中的一个灵活的插件,例如它使用CButtonColumn来为每行生成按钮.在这里我们会介绍怎么根据需求自定义按钮.

默认按钮
默认情况下 CButtonColumn 包含三个按钮:{查看(view)},{更新(update)}和{删除(delete)} ,它们的含义是显而易见的.

自定义它们的外观和行为的最简单的方法是使用CButtonColumn的属性,如:

updateButtonImageUrl (更新update 按钮的图片路径),

updateButtonLabel (更新按钮的标签,没有经过HTML编码) ,

updateButtonOptions (更新按钮的HTML选项,向其他插件的htmlOptions 属性一样)和 updateButtonUrl (通过PHP表达式得出的URL).你可以找到每个按钮各自的属性.

此外:

  1. 只有删除(delete)按钮拥有 deleteConfirmation (string) 属性,它用作点击删除按钮后显示的自定义确认信息.
  2. 在 xxxButtonUrl 属性的 PHP 表达式中 $row 表示行号(从0开始),$data 表示数据模型(model),$this 表示列对象.
  3. 当你设置 xxxButtonImageUrl 的属性为空或 false 时,文本形式的链接将会代替图片显示.

更灵活的定制

通过上面的属性自定义多个按钮在代码中时很混乱的,通过 模板(template) 和 按钮(buttons) 属性可以更灵活的自定义多个按钮。

你可以通过一下设置模板(template)属性的方式来构建或移除按钮.'header'  =>  '操作' ,  

Java代码  收藏代码
  1. array(  
  2.     'class'=>'CButtonColumn',  
  3.     'header' => '操作',  
  4.     'template'=>'{delete}{update}',                    
  5. ),  

在上例 CGridView 的按钮列中没有查看(view)按钮,而删除(delete)和更新(update)按钮为默认设置(删除按钮放到第一个位置).

隐藏按钮{update}{delete}

Java代码  收藏代码
  1. array(  
  2.     'class'=>'CButtonColumn',  
  3.     'deleteButtonOptions'=>array('style'=>'display:none'),  
  4.     'updateButtonOptions'=>array('style'=>'display:none'),  
  5.     'template'=>'{view}{update}{delete}',  
  6. ),  

同样你可以通过此属性添加新按钮 :{up}{down}

Java代码  收藏代码
  1. array  
  2. (  
  3.     'class'=>'CButtonColumn',  
  4.     'template'=>'{up}{down}{delete}',  
  5. )   

对于新的按钮(当然已有的也一样)你必须指定外观和行为.CButtonColumn 的属性 buttons 就是用来做这的,它是由每个按钮的ID(名称必须和template 提供的相同)对应其属性组成的数组.

你可以使用一下代码:

Java代码  收藏代码
  1. 'buttonID' => array  
  2. (  
  3.     'label'=>'...',     //按钮的文本标签.  
  4.     'url'=>'...',       //使用 PHP 表达式得出按钮的 URL.  
  5.     'imageUrl'=>'...',  //按钮的图片路径.  
  6.     'options'=>array(), //按钮的 HTML 选项.  
  7.     'click'=>'...',     //当点击按钮时调用的 javascript 函数  
  8.     'visible'=>'...',   //确定按钮是否显示的 PHP 表达式  
  9. )  

请注意: 当使用文字链接时 label 属性就会显示,当使用图片链接时 label 属性会被渲染为图片的 alt 参数.如果你想修改图片的 tooltip 文字,你可以修改 options 属性中的 title 参数,如:

Java代码  收藏代码
  1. 'buttonID' => array  
  2. (  
  3.     'label'=>'Text shown as alt text to image or as label to text link...',  
  4.     'options'=>array('title'=>'Text shown as tooltip when user hovers image...'),  
  5. )   

此外:

  1. 在 url 和 visible 属性的 PHP 表达式中 $row 表示行号(从0开始),$data 表示数据模型(model),$this 表示列对象.
  2. 当你设置 xxxButtonImageUrl 的属性为空或 false 时,文本形式的链接将会代替图片显示.

最后这里有一个添加新按钮的例子:

Java代码 $data->id))', ), 'down' => array ( 'label'=>'[-]', 'url'=>'"#"', 'visible'=>'$data->score > 0', 'click'=>'function(){alert("Going down!");}', ), ), )," quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage=""> 收藏代码
  1. array  
  2. (  
  3.     'class'=>'CButtonColumn',  
  4.     'template'=>'{email}{down}{delete}',  
  5.     'buttons'=>array  
  6.     (  
  7.         'email' => array  
  8.         (  
  9.             'label'=>'Send an e-mail to this user',  
  10.             'imageUrl'=>Yii::app()->request->baseUrl.'/images/email.png',  
  11.             'url'=>'Yii::app()->createUrl("users/email", array("id"=>$data->id))',  
  12.         ),  
  13.         'down' => array  
  14.         (  
  15.             'label'=>'[-]',  
  16.             'url'=>'"#"',  
  17.             'visible'=>'$data->score > 0',  
  18.             'click'=>'function(){alert("Going down!");}',  
  19.         ),  
  20.     ),  
  21. ),  

请注意: 因为 jQuery 用在这里,任何在 click 中使用的函数都将被 jQuery 函数包围,这就是为什么我们使用'click'=>'function(){alert("Going down!");}' 而不是 'click'=>'alert("Going down!");'

在上面的例子中同样可以看出怎么创建一个包含控制器视图和用户ID(或当前行的其他数据)的有效URL,同样也可以看出怎么使用 CHttpRequest 类中的 baseUrl 函数来设置存放在 protected 文件夹外的图片.

指定删除按钮的确认信息

你可能会注意到使用 Gii 生成的标准 CRUD 操作中的删除菜单项包含确认信息.这个信息可以很容易地 修改或扩展到数据中的指定记录,如记录ID.

因为 deleteConfirmation 属性不会在 CGridView 中的 CButtonColumn 中解析,所以实现不是这么简单,这里又一个巧妙的方式使用 jQuery 来实现它(感谢  提供),下面是例子:

Java代码  收藏代码
  1. array  
  2. (  
  3.         'class'=>'CButtonColumn',  
  4.         'deleteConfirmation'=>"js:'Record with ID '+$(this).parent().parent().children(':first-child').text()+' will be deleted! Continue?'",  
  5. ),  

我们同样可以使用 jQuery 的  函数为其他列检索内容.

Java代码  收藏代码
  1. array  
  2. (  
  3.         'class'=>'CButtonColumn',  
  4.         'deleteConfirmation'=>"js:'Do you really want to delete record with ID '+$(this).parent().parent().children(':nth-child(2)').text()+'?'",  
  5. ),  

序号,链接,复选框

如果你想链接单元格在网格视图中的内容,在订单列表中的某些页面,例如,如果你想客户的名称是管理客户的详细信息页面的链接,改变列CGrid查看

Java代码 $data->user_id, "m"=>"users") ), array("class"=>"facebox", "title"=>"View Customer Details") )', 'header' => 'Customer' // table header name ), array( 'class'=>'CButtonColumn', ), ) " quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage=""> 收藏代码
  1. 'columns' => array(  
  2.     array(  
  3.         'class'=>'CCheckBoxColumn',   
  4.         'value'=>'$data->id',  
  5.         'checked'=>'true',         
  6.         'selectableRows' => 2,  
  7.         'checkBoxHtmlOptions' => array('name'=>'id[]'),  
  8.      ),  
  9.      array(  
  10.          'name'=>'序号',   //$this->grid->dataProvider->getTotalItemCount() 总条数  
  11.          'value'=>'$this->grid->dataProvider->getPagination()->getOffset()+($row+1)',//CDataColumn $this->grid  
  12.          'htmlOptions'=>array(  
  13.          'width'=>'5px',  
  14.          ),  
  15.      ),  
  16.     'user_id'=> array(  
  17.         'type'=>'html',  
  18.         'value' => 'CHtml::link( $data->user->name,  
  19.            Yii::app()->createUrl( "admin/view", array("id"=>$data->user_id, "m"=>"users") ),  
  20.            array("class"=>"facebox""title"=>"View Customer Details") )',  
  21.         'header' => 'Customer' // table header name  
  22.     ),  
  23.     array(  
  24.         'class'=>'CButtonColumn',  
  25.     ),  
  26. )  

"Type"代表属性的类型.它确定属性值怎样被格式化和显示. 它默认为'text'. "Type"应该CFormatter被识别, 这些"Type"值是有效的: raw , text, ntext, html, date, time, datetime , boolean, number, email , image , url.

如果class=>"CLinkColumn"

Java代码  收藏代码
  1. array('class'=>'CLinkColumn','label'=>'查看用户','url'=>Yii::app()->createURL('user/edit'))  

自定义filter

Java代码  收藏代码
  1. this->widget('zii.widgets.grid.CGridView', array(  
  2.     'id'=>'buyer-contracts-grid',  
  3.     'dataProvider'=>$model->search(),  
  4.     'filter'=>$model,  
  5.     'columns'=>array(  
  6.         array(  
  7.             'filter'=>CHtml::listData(BbscrmCategory::model()->findAll(), 'id''name'), //select filter  
  8.             'name'=>'offer_id',  
  9.             'value'=>'$data->offer->name'  
  10.         ),  
  11.     ),  
  12. )); ?> 
阅读(2709) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~