Yii2 GridView Row click

Dear All,

I prefer using gridview row click to go to view page instead of actions. It was easy in Yii 1.1.x but Yii2 i am not able to find sample.

Could you please help me do that?

Thanks,

Shiv

That´s what I would also like to know.

Row click is usefull on a tablet or smartphone when an icon is to small to click.

With JavaScript?

No Reply yet,

Hope someone can help us.

We request row click should be builtin gridview so it can be more useful.

I would try to achieve that if i didnt get reply in next 1 week.

Thanks,

Shiv

After much trial and error I figured out how to do it and its quite easy:

Just use the ‘rowOptions’ to do 2 things:

  1. Add the unique identifier from your model as the ID of the row and add the onclick to the row like so:



'rowOptions' => function ($model, $key, $index, $grid) {

		return ['id' => $model['id'], 'onclick' => 'alert(this.id);'];

	},



And now when the user clicks on the row ‘this.id’ will be the ID of the data in your table and you can do whatever you want: Open your edit form, open a modal etc…

Hope this helps!

For clean code…

I would suggest removing the onClick() and putting in a separate JS file.

I’m guessing you wrote it that was as an example but for the less experienced folks it is best to separate it out into a js file.

I wouldn’t necessarily put the onclick itself in a separate file. Yes I do agree that the code it executes should be in a separate file (i.e. the alert) but for readability I think its better to leave it there. And also you might need to leave it there because you only want the onclick to apply to the rows with data in them. Not all of the rows in the table else you’d get click callbacks when the user clicked on the header rows. Which you don’t want.

Thanks!

I put this into my own extended gridview class:


    public function init()

    {

        parent::init();


        // onclick event should always open detail view:

        if ($this->rowOptions == NULL)

            $this->rowOptions =

                function ($model, $key, $index, $grid) {

                    // get the model name is necessary, if the grid is not the main grid

                    // without this the routed view is the view of the main controller

                    $u= \yii\helpers\StringHelper::basename(get_class($model));

                    $u= yii\helpers\Url::toRoute(['/'.strtolower($u).'/view']);

                    return ['id' => $model['id'], 'onclick' => 'location.href="'.$u.'&id="+(this.id);'];

                };

    }

Does anybody know how get the controller of the ActionColumn?

This would be better than using get_class($model), because if you set a different controller the right one would be opened in the onclick-event (if you have more than one gridview on your page, for example).


        

['class' => 'yii\grid\ActionColumn',

         'controller' => 'contact',

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

This worked for me:
This will make specific column clickable and shall open /controller/view/id

GridView::widget([
    'dataProvider' => $dataProvider,
    'filterModel' => $YourFilterModel,
	'columns' => [
		['attribute'=>'columnname',
		'format'=>'raw',
		'value' => function($data)
		{return Html::a($data->columnname, [Yii::$app->controller->id.'/view','id'=>$data->id]);}
		],
	],
]);
1 Like