当前位置: 代码迷 >> Ajax >> Yii框架zii.widgets.grid自定义旋钮,ajax触发事件并提示
  详细解决方案

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

热度:694   发布时间:2012-08-30 09:55:54.0
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.
From:http://www.cnblogs.com/wuyunhua/archive/2011/12/25/2300900.html

?

  相关解决方案