Yii框架zii.widgets.grid自定义按钮，ajax触发事件并提示
我们在用表格展示数据并管理的时候，可能会需要用到按钮来操作某一行数据，比如查看，修改，删除！
Yii内置了3种按钮：查看，修改和删除，你可以自定义样式、事件。详细配置见类参考：CButtonColumn.
如果需要自定义按钮绑定指定的事件该怎么办呢？
幸运的是Yii提供了自定义按钮的办法.看代码：
在视图文件里面：
$this->widget('zii.widgets.grid.CGridView', array(
'id'=>'xx-xx-grid',
'dataProvider'=>$model->search(),
'filter'=>$model,
'pager'=>array(
'class'=>'CLinkPager',
'nextPageLabel'=>'下一页',
'prevPageLabel'=>'上一页',
'header'=>'',
),
'summaryText'=>'<font color=#0066A4>显示{start}-{end}条.共{count}条记录,当前第{page}页</font>',
'columns'=>array(
array(
'name'=>'id',
'htmlOptions'=>array('width'=>'25'),
'sortable'=>false,
),
array(
'class'=>'CButtonColumn',
'template'=>'{view} {update}',
'viewButtonOptions'=>array('title'=>'查看'),
'updateButtonOptions'=>array('title'=>'修改'),
),
array(
'class'=>'CButtonColumn',
'header'=>'首页展示',
'template'=>'{add} {del}',
'buttons'=>array(
'add' => array(
'label'=>'展示', // text label of the button
'url'=>'Yii::app()->controller->createUrl("focus/create",array("id"=>$data->primaryKey,"type"=>1))', // a PHP expression for generating the URL of the button
'imageUrl'=>'http://s.maylou.com/common/images/ysh.jpg', // image URL of the button. If not set or false, a text link is used
'options'=>array('style'=>'cursor:pointer;'), // HTML options for the button tag
'click'=>$click, // a JS function to be invoked when the button is clicked
'visible'=>'SiteRecommend::isItemInTypeAndId(1, $data->id)?false:true',
),
'del' => array(
'label'=>'取消展示', // text label of the button
'url'=>'Yii::app()->controller->createUrl("focus/delete",array("id"=>$data->primaryKey,"type"=>1))', // a PHP expression for generating the URL of the button
'imageUrl'=>'http://s.maylou.com/common/images/yzhu.jpg', // image URL of the button. If not set or false, a text link is used
'options'=>array('style'=>'cursor:pointer;'), // HTML options for the button tag
'click'=>$click, // a JS function to be invoked when the button is clicked
'visible'=>'SiteRecommend::isItemInTypeAndId(1, $data->id)?true:false',
)
),
),
),
));
buttons选项提供了创建按钮的方法，上面创建了2个按钮:add和del，并注册到template里面。其中最主要的是click选项，决定了你的触发条件。这里用ajax触发。在上面的代码前面加上$click内容：
$csrfTokenName = Yii::app()->request->csrfTokenName;
$csrfToken = Yii::app()->request->csrfToken;
$csrf = "\n\t\tdata:{ '$csrfTokenName':'$csrfToken' },";
$Confirmation= "你确定要这么做？";
$afterDelete = 'function(link,success,data){ if(success) alert(data); }';
$click=<<<EOD
function() {
if(!confirm("$Confirmation")) return false;;
var th=this;
var afterDelete=$afterDelete;
$.fn.yiiGridView.update('build-oneprice-grid', {
type:'POST',
url:$(this).attr('href'),$csrf
success:function(data) {
$.fn.yiiGridView.update('build-oneprice-grid');
afterDelete(th,true,data);
},
error:function(XHR) {
return afterDelete(th,false,XHR);
}
});
return false;
}
EOD;
csrf不用管他，是安全验证，必须要有，否则会400报错.$click是js函数的字符窜，用了文档字符窜形式，注意结束的EOD前面必须没空格，也不能缩进。
这是Yii内置的yiiGridView Jquery插件，把请求提交到控制器的动作里面处理，然后返回结果并显示。最后还会更新一次gridview.