Passing Primary Key Id As Parameter To Js Function In Custom Cgridcolumn “Click” Array Parameter

Yii 1.1 General Discussion
1

I have a CButtonColumn in my CGridView pressing which invokes my JS routine. The JS routine makes the Ajax call and deletes a record. I need to pass the primary key of my record to the JS function to delete the intended record. I have consulted this link and was able to attach the JS with my customized button call and tested it by hardcoding a PK value. One approach which is mentioned in the same link is to access the text in the first column of the grid was useful (please refer to myBtn column code given below where jQuery code is used). Using that approach if I display the PK column in the gird then my problem is solved but showing the PK values to users is definitely not a choice. I even tried to hide the column by setting the htmlOPtions using display:none but that leaves me with the column heading still dangling on top which looks very shabby.

Following is my JS function:




function DeleteRec(Rec_id) {

alert(Rec_id); //var    Rec_id=27;var data=$("#subject-form").serialize();$.ajax({   type: 'POST',

url: '<?php echo Yii::app()->createAbsoluteUrl("upm/subject/deleteRec/id"); ?>'+'/'+Rec_id,   data:data,success:function(data){

    var myObject = eval('(' + data + ')');

    alert(myObject.recDelete);      

    }

    ,   error: function(data) { // if error occured

var myObject = eval('(' + data + ')');

     alert("Error occured.please try again"+myObject);

     var myObject = eval('(' + data + ')');

      var myJSONText = JSON.stringify(myObject);

},


[

Following is my CGridView code:




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

    'dataProvider'=>$PatHistoryGrid,

    'id'=>'PatGrid',

    'enableSorting'=>false,

    'enablePagination'=>false,

    'columns'=>array('id'=>array('name'=>'','value'=>'$data->id','htmlOptions'=>array('style'=>'display:none;',)),

                    'Pat'=>array('name'=>'Pat Name','value'=>'$data->pat->pat_val', 'htmlOptions'=>array('width'=>'240'),),

                      'PatDate'=>array('name'=>'Date','value'=>'$data->pat_date','htmlOptions'=>array('width'=>'80','align'=>'middle')),    

                      'PatNotes'=>array('name'=>'Pat Notes','value'=>'$data->pat_notes','htmlOptions'=>array('width'=>'480','align'=>'middle')),                  

                      'PatPreNotes'=>array('name'=>'Pat Pre Notes','value'=>'$data->pat_pre_notes','htmlOptions'=>array('width'=>'480','align'=>'middle')),

                      'Flag'=>array('type'=>'raw','name'=>'Flag','value'=>'$data->flag','htmlOptions'=>array('width'=>'50')),

                        array('class'=>'CButtonColumn',

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

                              'buttons'=>array(

                                                'myBtn'=>array( 'click'=>'function(){DeleteRec($(this).parent().parent().children(":first-child").text());}',),

                                              ),

                            ),                    

    ),

    'htmlOptions'=>array('style'=>'margin-top:-40px;'),

));

Is there a way to add a CGridColumn and yet not to be displayed, like a hidden variable in form? If that’s possible then I will be able to solve this problem. Any other ideas are most welcome. Thanks in advance.

Regards,

Faisal

2

I devised the solution. I created new a property in my model which returned the anchor HTML with the JS function name and the PK as its parameter. I added a new column in the grid and made its value to that property. The only difference in this column and other regular columns is that it contains its type as raw. Following is the code snippet of my model property:




 public function getDataDel(){

     return '<a class="myBtn" title="myBtn" click="DeleteRec('.$this->id.') " href="#">myBtn</a>';

}

Following is my CGridView code:




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

'dataProvider'=>$PatHistoryGrid,

'id'=>'PatGrid',

'enableSorting'=>false,

'enablePagination'=>false,

'columns'=>array('Pat'=>array('name'=>'Pat Name','value'=>'$data->pat->pat_val', 'htmlOptions'=>array('width'=>'240'),),

                  'PatDate'=>array('name'=>'Date','value'=>'$data->pat_date','htmlOptions'=>array('width'=>'80','align'=>'middle')),    

                  'PatNotes'=>array('name'=>'Pat Notes','value'=>'$data->pat_notes','htmlOptions'=>array('width'=>'480','align'=>'middle')),                  

                  'PatPreNotes'=>array('name'=>'Pat Pre Notes','value'=>'$data->pat_pre_notes','htmlOptions'=>array('width'=>'480','align'=>'middle')),

                  'Flag'=>array('type'=>'raw','name'=>'Flag','value'=>'$data->flag','htmlOptions'=>array('width'=>'50')),

    'Delid'=>array('type'=>'raw','name'=>'Btns','value'=>'$data->datayDel','htmlOptions'=>array('width'=>'50')),

),

'htmlOptions'=>array('style'=>'margin-top:-40px;'),));
3

Just another update on a more elegant solution for the same problem. Please visit this link for the accepted solution.