handontable中的评论定位问题

Question

I am using handsontable's comment and scroll feature, but it results in wrong positioning of comment when scrolled.

Here is jsfiddle of code

Please scroll and then hover for comment, it shows comment div goes out of its position.

Objects attribute:

    data: getData(),   
    rowHeaders: true,
    colHeaders: true,
    minSpareRows: 1,
    contextMenu: true,
    comments: true,

I want it should come same as it comes without scrolling.

Answer 1

The problem is a bug in the placeCommentBox . It's getting an wrong offSet position

Based on this post , I modified handsontable.full.js .The placeCommentBox function should look like this:

 placeCommentBox = function (range, commentBox) {
  var TD = instance.view.wt.wtTable.getCell(range.from),
   // wrong offset offset = Handsontable.Dom.offset(TD),
    lastColWidth = instance.getColWidth(range.from.col);
    var rect = TD.getBoundingClientRect();
    var docEl = document.documentElement;
    var rectTop = rect.top + window.pageYOffset - docEl.clientTop;
  commentBox.style.position = 'absolute';
  commentBox.style.left = offset.left + lastColWidth + 'px';
  commentBox.style.top = rectTop + 'px';
  commentBox.style.zIndex = 2;
  bindMouseEvent(range, commentBox);
},

You can modify your file or wait for the to fix the bug.

Answer 2

Edit handsontable.full.js -> refreshEditorPosition: function()

Before setting position of editor just add window.pageXOffset

// offset bug
x += window.pageXOffset;
this.editor.setPosition(x, y);