将主键ID作为参数传递给自定义CGridColumn“Click”数组参数中的JS函数

时间:2012-10-16 23:35:04

标签: gridview yii

我在CGridView按下时有一个CButtonColumn,它会调用我的JS例程。 JS例程进行Ajax调用并删除记录。我需要将我的记录的主键传递给JS函数以删除预期的记录。我已经咨询了this链接,并能够通过我的自定义按钮调用附加JS,并通过硬编码PK值对其进行测试。在同一链接中提到的一种方法是访问网格第一列中的文本是有用的(请参考下面给出的使用jQuery代码的myBtn列代码)。如果我在网格中显示PK列,那么使用该方法然后我的问题就解决了,但向用户显示PK值绝对不是一个选择。我甚至试图通过使用display:none来设置htmlOPtions来隐藏列,但是这样我的列标题仍悬挂在顶部,看起来很破旧。

以下是我的JS(请原谅我的格式错误,我尝试了很多,但无法在代码片段标签中使用,有些事情需要堆栈处理:)

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);
        },
        dataType:'html'
    });
}

以下是我的CGridView代码:

$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;'
    ),
));

有没有办法添加CGridColumn但是不能显示,就像表单中的隐藏变量一样?如果那可能,那么我将能够解决这个问题。任何其他想法都是最受欢迎的。

2 个答案:

答案 0 :(得分:1)

我设计了解决方案。我在我的模型中创建了一个新属性,它返回带有JS函数名称和PK作为参数的锚HTML。我在网格中添加了一个新列,并将其值赋予该属性。此列和其他常规列的唯一区别是它包含其原始类型。以下是我的模型属性的代码片段:

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

以下是我的新CGridView代码:

$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->dataDel','htmlOptions'=>array('width'=>'50')),
),
'htmlOptions'=>array('style'=>'margin-top:-40px;'),));

答案 1 :(得分:0)

您可以为按钮添加课程:

'buttons' => array(
    'myBtn' => array(
        'options' => array('class' => 'myBtn')
    ),
),

然后在你的JS中你可以按照Yii方式得到一个id:

$('#PatGrid').on('click', '.myBtn', function() {
    var id = $.fn.yiiGridView.getKey(
        'PatGrid',
        $(this).closest('tr').prevAll().length 
    );
    alert(id);
    /* Your code */
});