Show an image as Tooltip in a GridDataCell

[Bernd]

Hi,

I got the following question:

How to show an image as Tooltip in a GridDataCell?
The image should only be visible if the user hovers over the cell.

Thanks in advance,

Ben

[Hetali]

Hi Bernd,

We have a dedicated article to Render Tooltips for Grid Cells. Using this example, make the following changes to show an image in the Tooltip:

<ng-template #template let-anchor>
  <img 
    style="width: 100px"
    src="{{ gridData[anchor.nativeElement.getAttribute('ng-reflect-data-row-index')].Image }}"
  />
</ng-template>

In this StackBlitz example, an image is shown in the tooltip when you hover over the ProductName column cells.

Please give this example a try and let me know if it helps or if I can further assist you.

Regards,
Hetali
Progress Telerik