Search code examples
javascripthandsontable

HandsOnTable - Show tooltip for cell


I want to show tooltip for a cell conditionally For e.g. if the cell value is not valid as per some rules, then show the text of the rule because of which it's invalid.

var hot = new Handsontable(document.getElementById('example'), {
    cells: function(row, col, prop) {
        var cellProperties = {};
        cellProperties.renderer = 'confirmTradePriceRederer';
        return cellProperties;
    }
});

function confirmTradePriceRederer(instance, td, row, col, prop, value, cellProperties) {
    Handsontable.NumericCell.renderer.apply(this, arguments);
    if (value is invalid) {
        td.style.color = 'red';
        //set tooltip here somehow

    }
}

Solution

  • I got it working using comments:

    enter image description here

    var hot = new Handsontable(document.getElementById('example'), {
        cells: function(row, col, prop) {
            var cellProperties = {};
            cellProperties.renderer = 'confirmTradePriceRenderer';
            return cellProperties;
        }
    });
    
    function confirmTradePriceRederer(instance, td, row, col, prop, value, cellProperties) {
        Handsontable.NumericCell.renderer.apply(this, arguments);
        if (value is invalid) {
            td.style.color = 'red';
            cellProperties.comment = 'Test Comment';
    
        }
    }