Use image as grid label

I’m working with a data column (yii\grid\DataColumn) for the gridview widget.

I want to configure the grid so that I can use an image as a label. Currently I can configure a column like so…

[

'attribute' => 'carspaces_garaged',


'header' => '<img src="/images/site/icons/car-sm-primary.gif">',    

],

This appears ok, however, it doesn’t enable a sorting link. It just returns the raw image.

If I do it like this:

[

'attribute' => 'carspaces_garaged',


'label' => '<img src="/images/site/icons/car-sm-primary.gif">',    

],

the sorting link works, but the label comes out as text and not html image. Does anyone know how I can configure an image and be able to use it as a clickable sorting link?

I will reply to this unanswered thread albeit rather later because it appears to remain unanswered and came up as the first hit in my Google search.
This is a fragment of code that should illustrate what you need to do to achieve an image as a header as well as an image in the column of a gridview.
The index is for a venues index and a column using a What 3 Words logo (w3w.gif).
[
‘attribute’ => ‘w3w’,
‘header’ => Html::img(‘@web/resources/images/icons/w3w.gif’, [‘alt’=>‘What 3 Words’]),
‘format’ => ‘raw’,
‘value’ => function ($model) {
return Html::img(‘@web/resources/images/icons/w3w.gif’, [‘alt’=>‘What 3 Words’]).’ '.$model->w3w;
},
],

1 Like