Yii 1.1: Update a part of content using AJAX when select a GridView row

9 followers

Suppose you want to refresh a form or any content when a single row of CGridView is selected

how to achieve that ?

In your view file modify your cgridview like that

$this->widget('zii.widgets.grid.CGridView', array(
        'id' => 'my-items-grid',
        'dataProvider' => $model->search(),
        'selectableRows' => 1, //permit to select only one row by the time
        'selectionChanged' => 'updateABlock', //javascript function that will be called
        'filter' => $model,
        'columns' => array(
            'id',
             ...
             ...

Into the same view just add this (or using javascript register)

<script type="text/javascript">
    function updateABlock(grid_id) {
 
        var keyId = $.fn.yiiGridView.getSelection(grid_id);
        keyId  = keyId[0]; //above function returns an array with single item, so get the value of the first item
 
        $.ajax({
            url: '<?php echo $this->createUrl('PartUpdate'); ?>',
            data: {id: keyId},
            type: 'GET',
            success: function(data) {
                $('#part-block').html(data);
            }
        });
    }
</script>

In your controller add the appropriate action method

public function actionPartUpdate($id = null) {
        $model = MyModel::model()->findByPk($id);
        if ($model === null)
            throw new CHttpException(404, 'The requested page does not exist.');
 
        $this->renderPartial('_myModelview', array('model' => $model));
        Yii::app()->end();
}

view file _myModelview.php could be contains any code including $model data. Remember to includes you code between this

<div id='part-block'>
//your php-html code
</div>

Total 2 comments

#15656 report it
Kostas Apazidis (KonApaz) at 2013/12/05 01:54am
Re: 15655

Hi Arslan

Either you write anonymous function or not is the same thing.

But writing the function in

<style></style>

block is more manipulated on editor like notepad++ or netbeans e.t.c.

In any case thanks for the comment!

#15655 report it
Arslan Butt at 2013/12/05 12:30am
You can use javascript in selectionChanged
selectionChanged'=>"function(id){
        var id  =   $.fn.yiiGridView.getSelection(id);
        $.post('".$this->createAbsoluteUrl('controller/action')."','', function(data) {
                if(data!='')
                {
                    $('#part-block').html(data);
                }
                else
                {
 
                    //to do something 
                }
 
            });
 
 
        }",

Leave a comment

Please to leave your comment.

Write new article