Difference between #3 and #2 of How to Enhance a CGridView

unchanged
Title
How to Enhance a CGridView
unchanged
Category
How-tos
unchanged
Tags
CGridView custom
changed
Content
by: Christian Salazar (bluyell, @salazachris74, christiansalazarh@gmail.com)

Yes i know CGridView is very complex and complete, but two things are not
covered by default:  1. Make items selected no matter if we change the page and
2. make a column to be editable. 

This two things have a nice solution proposed by me, making my effort to have no
bugs, if so please report.

1.Make a CGridView keep the selection between page changes
--------------------------------------------------------

This extension ([ekeepselection
extension](http://www.yiiframework.com/extension/ekeepselection/
"ekeepselection")) solves the problem and it is very easy to
implement.

To make it works:

~~~
[php]
$this->widget('zii.widgets.grid.CGridView', array(
        'id'=>'my-gridview',                  // IMPORTANT
        'selectableRows'=>2,                  // 2 = allow multiple 
        'dataProvider'=> $anyDataProvider,
        'columns'=>array(
            array('class'=>'CCheckBoxColumn'),  // ADD A CCheckBoxColumn
            'firstname',
            'lastname',
        ),
    ));
Yii::import('application.extensions.ekeepselection.*');
$dummy = new EKeepSelection('#my-gridview');
~~~

to receive the selected changes then use jQuery:

~~~
[javascript]
var selected_items = $('#my-gridview').keepSelectionData();
// selected_items is an array, not a string
// use: $.each(selected_items, function(k, value){ .. })

~~~

2.Make a CGridView column to be editable. 
-----------------------------------------

This extension makes the stuff by implementing a special column: [eeditable
extension](http://www.yiiframework.com/extension/eeditable
"eeditable")

In order to make it works you need to add a special kind of column:

  'class'=>'EEditableColumn' (and its extra attributes)

~~~
[php]
<?php
    Yii::import('application.extensions.eeditable.*');
    $grid_id	<?php
	Yii::import('application.extensions.eeditable.*');

	$grid_id = 'some-grid-view';
    $this->widget('zii.widgets.grid.CGridView',
	$this->widget('zii.widgets.grid.CGridView', array(
        'id'=>$grid_id,
        'dataProvider'=>$dataProvider,
        'columns'=>array(
            array('name'=>'firstname'),
            array('name'=>'example_field',
                'class'=>'EEditableColumn',
		'id'=>$grid_id,
		'dataProvider'=>$dataProvider,
		'columns'=>array(
			array('name'=>'firstname'),
			array('name'=>'example_field',
				'class'=>'EEditableColumn', 'editable_type'=>'editbox',
                'action'=>array('/some/ajaxeditcolumn'),
            ),
        ),
    ));
    ?>
				'action'=>array('/some/ajaxeditcolumn'),
			),
			array('name'=>'example_field_2',
				'class'=>'EEditableColumn', 'editable_type'=>'select',
				'editable_options'=>
					array(-1=>'--select--','1'=>'Yes','0'=>'No','3'=>'maybe!'),
				'action'=>array('/some/ajaxeditcolumn'),
			),
		),
	));
	?>

~~~

And this is the code required at server side to handle the change value event:

~~~
[php]
public function actionAjaxEditColumn(){
        $keyvalue   = $_POST["keyvalue"];   // ie: 'userid123'
        $name       = $_POST["name"];   // ie: 'firstname'
        $old_value  = $_POST["old_value"];  // ie: 'patricia'
        $new_value  = $_POST["new_value"];  // ie: '  paTTy '
 
        // do some stuff here, and return the value to be displayed..
        $new_value = ucfirst(trim($new_value));
        echo $new_value;            // Patty
    }

~~~

In hope it will be usefull for you..!
Write new article
  • Written by: bluyell
  • Updated by: CeBe
  • Category: How-tos
  • Yii Version: 1.1
  • Votes: +4
  • Viewed: 3,130 times
  • Created on: Apr 2, 2014
  • Last updated: Apr 14, 2014
  • Tags: CGridView custom