Passing variable inside CButtonColumn inside CGridView

Hello, I’m new in Yii.

I have a problem with CButtonColumn inside CGridView,

what I want to achieve is generating dynamic onClick handler when a button in CButtonColumn is clicked.

Here’s what I’e tried and fail:




this->widget('zii.widgets.grid.CGridView', array(

		'id'=>'roomTypeForm-grid',

		'dataProvider'=>$model->search(),

		'filter'=>$model,

		'columns'=>array(

                    //name button

                    'name',

                    array(

                        'class'=>'CButtonColumn',

                        'template'=>'{update}{delete}',

                        'buttons' => array(

                            'update' => array(

                                'url' => '"#"',

                                'click' => '

                                    function(){

                                    openForUpdate($data->id,$data->name,function(){ alert("updated"); $.fn.yiiGridView.update("roomTypeForm-grid"); }); // << THIS IS WHAT I WANT

                                    }

                                ',

                            ),

                        ),

                    ),

		),

	));



the problem is, this line:




                                'click' => '

                                    function(){

                                    openForUpdate($data->id,$data->name,function(){ alert("updated"); $.fn.yiiGridView.update("roomTypeForm-grid"); }); // << THIS IS WHAT I WANT

                                    }

                                ',

basically, the $data->id can’t be passed into the click event…

Is there any work around this?

Have you tried:




'click' => 'js:openForUpdate("."$data->id".","."$data->name".",function(){

       alert("updated"); 

       $.fn.yiiGridView.update("roomTypeForm-grid");

       }',



L.E: Not sure about concatenation of the php vars in the eval() mode for this case, maybe you need to tweak them a bit.

I found this works:




array(

	'class'=>'CButtonColumn',

            	'template'=>'{test}',

            	'buttons'=>array(

                		'test'=>array(

                    			'label'=>'AAA',

                    			'url'=>'"#"',

                    			'click'=>'function(){var rowIdx=$(this).closest("tr").attr("sectionRowIndex");var rowId=$("#"+$(this).closest("div.grid-view").attr("id")+" > div.keys > span:eq("+rowIdx+")").text();alert(rowId);}', 

                		),

	)

        ),



Regards,

Joachim

Wow, that works! :)

I just learned jquery, so I have difficulty understanding your code. would you please explain what you did there?

I also need to get the name (another field in the record), how do I do that?




// $(this) is the button element

// Get the closest/nearest TR / table row, and of that row, get the value of its index attribute (i.e. the 0-based row number):

var rowIdx=$(this).closest("tr").attr("sectionRowIndex");


// "#"+$(this).closest("div.grid-view").attr("id") will get the id of the grid view div

// Inside the grid view, there is a div with the class 'keys', where the primary keys are stored inside span tags

// The order of the prim. key spans corresponds to the table rows:

var rowId=$("#"+$(this).closest("div.grid-view").attr("id")+" > div.keys > span:eq("+rowIdx+")").text();

alert(rowId);



Regards,

Joachim