Yii框架zii.widgets.grid自定义按钮，ajax触发事件并提示

来源：互联网发布：知乎百万英镑编辑：程序博客网时间：2024/06/05 15:17

我们在用表格展示数据并管理的时候，可能会需要用到按钮来操作某一行数据，比如查看，修改，删除！

Yii内置了3种按钮：查看，修改和删除，你可以自定义样式、事件。详细配置见类参考：CButtonColumn.

如果需要自定义按钮绑定指定的事件该怎么办呢？

幸运的是Yii提供了自定义按钮的办法.看代码：

在视图文件里面：

Php代码  
$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内容：

Php代码  
$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.

From:http://www.cnblogs.com/wuyunhua/archive/2011/12/25/2300900.html

原文地址：http://hnlixf.iteye.com/blog/1553207