GWT CellTable tooltip not working properly

Question

I am using a CellTable and I want to show a tooltip whenever I hover over any of the cell. My code is working fine but the tooltip is not changing its position.

What I mean to say is, if I hover over cell 1 tooltip shows and then if I hover over cell 100, the tooltip data changes but the tooltip still shows at cell 1.

I am using following code:

cellTable.addCellPreviewHandler(new Handler<List<String>>() {
  @Override
  public void onCellPreview(CellPreviewEvent<List<String>> event) {
    if ("mouseover".equals(event.getNativeEvent().getType())) {
      Element cellElement = event.getNativeEvent().getEventTarget().cast();

      cellElement.setTitle('cell contents go here.');
    }
  }
}

Any help is much appreciated.
Thanks.

Answer 1

You can extend Column class and override method render. In render method you can use property "title", which is used to set the tool tip text. Simple example:

SampleColumn<T> extends TextColumn<T> {

  @Override
  public void render(Context context, T object, SafeHtmlBuilder sb) {
    sb.appendHtmlConstant("<div title=\"" + getTitle(object) + "\">");
    sb.appendEscaped(getValue(object));
    sb.appendHtmlConstant("</div>");
  }

  @Override
  public String getValue(T object) {
    return displayedValue;
  }

  public String getTitle(T object) {
    return yourTooltipText;
  }
}

When using this code, the tooltip will be exacly near the target cell.