jQuery UI Widgets Forums Dialogs and Notifications Tooltip, Notification, Popover jqxTooltip showDelay not working in jqxGrid

This topic contains 3 replies, has 2 voices, and was last updated by  Hristo 6 years, 8 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author

  • alex1902

    Hi everyone!

    What I am doing is showing a tooltip with the text that is in the jqxGrid cell hovered only if the text in it is bigger than the cell itself. That works well. What I want to do is to put a delay of 1 second before showing the tooltip, so when a user passes the grid with his mouse there is not alway a tooltip hiding the data, unless the user wants to see the whole content of the cell. Here is the cellhover part of the code I have.

    cellhover: function (element, pageX, pageY)
                            el = element.getElementsByTagName('div')[0];
                            var curOverflow = el.style.overflow;
                            if (!curOverflow || curOverflow === "visible")
                                el.style.overflow = "hidden";
                            var isOverflowing = el.clientWidth < el.scrollWidth
                                || el.clientHeight < el.scrollHeight;
                            el.style.overflow = curOverflow;
                            // If there is an overflow, show the tooltip, otherwise, close it (and its not a header)
                            if (isOverflowing) {
                                $("#"+selector).jqxTooltip({ showDelay: 1000, content: element.innerHTML });
                                $("#"+selector).jqxTooltip('open', pageX + 15, pageY - 10);
                            else {
                                // We force the tooltip to destroy the tooltip, to avoid residues
                                $("#"+selector).bind('close', function () { $("#jqxgrid").jqxTooltip('destroy'); });

    Basically, $("#"+selector).jqxTooltip({ showDelay: 1000, content: element.innerHTML }); is called, but there is no delay in the showing of the tooltip, like it’s supposed to be done in your example : http://jsfiddle.net/jqwidgets/rcqcn3qc/

    Do you have any idea why there is no delay for the tooltip in my case?
    Any help would be greatly appreciated!

    Have a nice day!


    Hello alex1902,

    Please, take a look at this example:
    Also, I would like to suggest you look at our forum there have many topics related to this scenario as this one:

    Best Regards,
    Hristo Hristov

    jQWidgets team


    Hi Hristo,

    Thank you for your answer.

    I found the problem. Basically, if you use ‘open’ with the delay, the delay won’t work. In my computer and the computer of my colleague at least,
    the link you provided the showDelay doesn’t work if you let the line $("#jqxgrid").jqxTooltip('open', pageX + 15, pageY + 15); in the code. Once you remove it, it works. For instance, in the that example : http://jsfiddle.net/jqwidgets/rcqcn3qc/ you don’t have the open, so the showDelay works. By removing $("#"+selector).jqxTooltip('open', pageX + 15, pageY - 10); from my code the delay works, but the tooltip won’t follow my cursor, it will stay at a fixed position in relation to the cell hovered. In my case that behavior is better than the first one. However, I still can’t make showDelay work with the above line of code (which is needed to have the tooltip follow the cursor). In you example it doesn’t work also.

    I use jQWidgets v4.0.0 (2016-Jan), if it helps.



    edit: the showDelay from you link provided doesn’t work, for the reasons I explained above. I assume jsfiddle uses the latest version so my version might not be the problem.

    • This reply was modified 6 years, 9 months ago by  alex1902.


    Hello Alex1902,

    Unfortunately, I cannot provide you another solution.
    Please, take a look at this example, as an alternative.
    Thank you for the understanding.

    Best Regards,
    Hristo Hristov

    jQWidgets team

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.