Handsontable custom tooltip display issue for the last row

Tags: #<Tag:0x00007fee2be25ab0>

In Handson table I am displaying one custom tooltip with error message. While the particular cell has some error, on hover over that error cell, the custom error tooltip will display. It’s working fine, issue is only on the last row of the table. The error tooltip is displaying below the table and automatically one side scrollbar is coming on scroll of the sidebar, I can only view that tooltip. Expectation is that, without scroll need to view the tooltip.
Below the fiddle link I have created:
Handsontable example - JSFiddle - Code Playground

Hi @santu.nandi

I can’t observe the issue happening in the example you sent, but I believe that what you can do to avoid is to programatically check if the tooltip is on the bottom of the table, and the reposition it so it won’t be below the table.

When the tooltip is displaying for the last row, on displaying the tooltip the side scroll is automatically came so user need to scroll to view the message.

How can we reposition the tooltip? If we add tooltip below the cell so all row’s cell tooltip will display below the cell. If we can change if the bottom of cell has no space to display, the tooltip will automatically display above of the cell. Otherwise, the tooltip will display bottom of the cell.

If you have any example to reposition the tooltip, can you please provide that example?

We don’t have such example, as the tooltips are custom implementation and not integral part of Handsontable. However, I’ve found different solution. You can style the tooltip so it will show the text in one line, then there will be not need to scroll to see the whole message:


In our requirement we have more than one error for cell. So, that time we need to display more than one line. For that how we can achieve?

Hi @santu.nandi

That seems to be strictly styling problem, so I can’t help here much. It depends on your design choices and requirements.