Yii – How to customize a CGridView CbuttonColumn

Update – Delete – View

I’m sure you’ve already seen and used the basic buttons in a CGridView and maybe even used the template phrases to modify the behaviours

array(
     'class'=>'CButtonColumn',
     'template'=>'{delete}{update}',
     'buttons'=>array(
               'update'=>array(
                         'url'=>'$this->grid->controller->createUrl("/History/update", array("id"=>$data->primaryKey,"asDialog"=>1,"gridId"=>$this->grid->id))',
                         'click'=>'function(){$("#cru-frame").attr("src",$(this).attr("href")); $("#cru-dialog").dialog("open");  return false;}',
                         ),
               'delete'=>array(
                         'url'=>'$this->grid->controller->createUrl("/History/delete", array("id"=>$data->primaryKey,"asDialog"=>1,"gridId"=>$this->grid->id))',
                         ),
               ),

 

but sometimes we need to break out of this box and create custom buttons for slightly more exciting function like ordering with up and down buttons, or email, or add … and many more!

Custom Buttons

So you can add custom templates (or re-define existing ones) by using further properties of the CButtonColumn object as follows:-

  array(
    'class'=>'CButtonColumn',
    'template'=>'{update}{add}{delete}',
    'buttons'=>array(
      'update'=>array(
          'url'=>'$this->grid->controller->createUrl("/Extras/update", array("id"=>$data->id,"asDialog"=>1,"gridId"=>$this->grid->id))',
          'click'=>'function(){$("#cru-frame").attr("src",$(this).attr("href")); $("#cru-dialog").dialog("open");  return false;}',
            'visible'=>'($data->id===null)?false:true;'
          ),
      'add' => array(
          'label'=>'Add',
          'imageUrl'=>Yii::app()->request->baseUrl.'/css/gridViewStyle/images/gr-plus.png',
          'url'=>'$this->grid->controller->createUrl("/Extras/create", array("eid"=>$data->extras_id, "bid"=>'.$model->id.', "asDialog"=>1,"gridId"=>$this->grid->id))',
          'click'=>'function(){$("#cru-frame").attr("src",$(this).attr("href")); $("#cru-dialog").dialog("open");  return false;}',
          'visible'=>'($data->id===null)?true:false;'
          ),
      'delete'=>array(
          'url'=>'$this->grid->controller->createUrl("/Extras/delete", array("id"=>$data->primaryKey,"asDialog"=>1,"gridId"=>$this->grid->id))',
          ),
    ),
  ),

Let’s have closer look at how this works … next »

Let’s Start a Project!

Contact Me