Search code examples
javascriptextjsextjs4extjs3extjs-grid

display row tooltip on condtion base on row mouse hover

I am using this code in grid render event for display tpl on row mouse hover 

grid.tip = new Ext.ToolTip({
    view: grid.getView(),
    target: grid.getView().mainBody,
    delegate: '.x-grid3-row',
    trackMouse: true,
    renderTo: Ext.getBody(),
    showDelay: 1000,
    listeners: {
        beforeshow: function updateTipBody(tip) {
            var i = grid.getView().findRowIndex(tip.triggerElement);
            var ViewObj = grid.getStore().getAt(i);
            var nameVar, addressVar, salesOrgVar;
            if (ViewObj.get('ERROR_MESSAGE') != null && (ViewObj.get('ERROR_MESSAGE')).length > 1) {

                console.log("done..");
                nameVar = (ViewObj.get('ERROR_MESSAGE') != null && ViewObj.get('ERROR_MESSAGE') != "") ? (Ext.BUNDLE.getMsg('POSFilesWidget.ErrorFolderGrid.ErrorFolder.label') + " : " + ViewObj.get('ERROR_MESSAGE')) : "";
                tip.update(nameVar);
            } else {
                tip.setSize(0, 0);
                tip.setVisible(false);
                console.log("1..");
            }
        }
    }
});

but when message not come then it display me blank tpl, but I do not want to show tooltip please see the image

enter image description here

Solution

  • This is an ExtJS bug. You have to call 

    Tooltip.render(Ext.getBody());

    at the begin of your App. And then in your listener 

    return false;

    when you don't want to show the tooltip.