Add a tooltip in column header cell

Tags: #<Tag:0x00007efc60010a28> #<Tag:0x00007efc60010780>

Hi there !

I would like to add a tooltip in the header of a column.

I see that a similar question was asked here : Tooltip in cell but it concerned normal cells (not headers). The solution was to create a custom renderer for that.
However, I guess that it is impossible to create a renderer for a header cell.

Is there a way around this issue ?

I have also seen this documentation : https://handsontable.com/docs/7.2.2/demo-header-tooltips.html but I think that it does not correspond to my needs since it seems to be restricted to displaying a tooltip with the exact same text as in the header

Hi @gregoire.spiers

If you’re using the newest version of Handsontable I recommend using the new documentation as well. The one you linked of for Handsontable 7.2.2 which is from October 2019. For example, in the newest version of Handsontable, that plugin was deprecated.

However, you can still add the tooltips. To do this I recommend using the afterGetColHeader hook. Here’s a demo https://jsfiddle.net/handsoncode/f5d6p237/. Then you can also use the hover action hook like here https://jsfiddle.net/handsoncode/6myhosbx/ .

1 Like

Great, that is exactly what I need, thank you !

Great! I was happy to help.

I’ll close this thread. But please feel free to contact us at support@handsontable.com or open a new thread when needed.