Tooltip doesn't always remove itself

12 posts, 1 answers
  1. Steve
    Steve avatar
    1869 posts
    Member since:
    Dec 2008

    Posted 24 Apr 2013 Link to this post

    http://screencast.com/t/QEp6FWPyLT

    This happens on the header and footer...

    It's a UL\LI with the tooltip applied to the LI

    Any ideas?
  2. Rosen
    Admin
    Rosen avatar
    3247 posts

    Posted 26 Apr 2013 Link to this post

    Hi Steve,

    Are you using one instance of the Tooltip with a filter or multiple Tooltip widgets (one for each selected element). If the later is true, then you will need to close the other Tooltip instances manually, in order to ensure that only one instance is open at a time. This can be achieve via the show event as shown in this sample.

    Greetings,
    Rosen
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Steve
    Steve avatar
    1869 posts
    Member since:
    Dec 2008

    Posted 26 Apr 2013 Link to this post

    See attached

    The script just calls
    $(".tooltip").kendoTooltip();

    ...with the idea that if I need a tooltip anywhere just append that class
  4. Rosen
    Admin
    Rosen avatar
    3247 posts

    Posted 29 Apr 2013 Link to this post

    Hi Steve,

    In such case you are using multiple tooltip instances and you should manually close them, as shown in my previous post. However, if the widget is instantiated over a single element which contains the elements for tooltipification, and the appropriate filter is set, then popup will be close automatically.

    $("#container").kendoTooltip({
        filter: ".tooltip"
    });

    Greetings,
    Rosen
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. Steve
    Steve avatar
    1869 posts
    Member since:
    Dec 2008

    Posted 29 Apr 2013 Link to this post

    I'm sorry Rosen, I don't understand...

    I can't just tell elements to be tooltips, I have to pass in a parent and filter to the elements?

    So in this case
    $("body").kendoTooltip({
        filter: ".tooltip"
    });
    I don't understand why it was build this way?
  6. Answer
    Rosen
    Admin
    Rosen avatar
    3247 posts

    Posted 29 Apr 2013 Link to this post

    Hello Steve,

    You can use both ways to instantiate ToolTip widget. However, in the first case as the selector returns multiple elements, thus multiple kendoTooltip instances will be created. As opposite to the container/filter approach, where a single instance of the Tooltip is created and a single popup is position dynamically at the appropriate targets - a shared tooltip.

    Greetings,
    Rosen
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. Steve
    Steve avatar
    1869 posts
    Member since:
    Dec 2008

    Posted 29 Apr 2013 Link to this post

    Got it, thanks! :)
  8. Syleps
    Syleps avatar
    5 posts
    Member since:
    Nov 2013

    Posted 15 Aug Link to this post

    Hi,

    It's a old ticket, but the issue is still there.

    If you take the previous sample and you replace autoHide: false by autoHide:true, sometimes tooltyp doesn't hide

     

    Regards

  9. Ivan Danchev
    Admin
    Ivan Danchev avatar
    1222 posts

    Posted 17 Aug Link to this post

    Hello,

    Could you specify step-by-step the user actions that are needed for the ToolTip to remain visible and not hide? Here's a dojo example, which uses the linked examples logic, but loads the latest version of the Kendo UI js and CSS files. As shown in this short screencast the ToolTip hides when you move the cursor away from the divs.

    Regards,
    Ivan Danchev
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  10. Syleps
    Syleps avatar
    5 posts
    Member since:
    Nov 2013

    Posted 5 days and 15 hours ago Link to this post

    Hi,

    After several hours to find the problem I had, I succed to find a case of error. See this Sample

    This seems to be a problem with the data-role and role of Kendo buttons, but ... (I use .NET ASP.MVC C#)

    Regards

  11. Ivan Danchev
    Admin
    Ivan Danchev avatar
    1222 posts

    Posted 1 day and 16 hours ago Link to this post

    Hi,

    I gave the linked dojo example a try in Chrome, Firefox and IE11 and was unable to reproduce the ToolTip remaining open when the buttons are not hovered in neither of them. At your end are you able to replicate the issue in all browsers or it is browser-specific?
    The MVC ToolTip:
    @(Html.Kendo().Tooltip()
        .For("[title]:not([title='']")
        .AutoHide(true)
        .Events(e => e.Show("show"))
    )
    behaved the same way.
    Is there any specific chain of actions (hovering, clicking the buttons,etc.) that needs to be followed in order for the issue to be exhibited? Also, are you using the latest official Kendo UI version (2017.2.621)?

    Regards,
    Ivan Danchev
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  12. Syleps
    Syleps avatar
    5 posts
    Member since:
    Nov 2013

    Posted 1 day and 13 hours ago in reply to Ivan Danchev Link to this post

    Hi,

    Indeed, the example I gave now works correctly on Chrome & FF. And more than that, in my screens, the tooltips work on the buttons. It's incomprehensible ... The issue is still here with IE11 (see attachment).
    There are still some issues with grid columns, for all browsers (see attachment)

    Of course, I use Kendo 2017.2.621. Here is the beginning of my pages

    <script src="/Scripts/kendo/2017.2.621/jquery.min.js"></script>
    <script src="/Scripts/polyfill-resize.js"></script>
    <script src="/Scripts/kendo/2017.2.621/angular.min.js"></script>
    <script src="/Scripts/kendo/2017.2.621/jszip.min.js"></script>
    <script src="/Scripts/kendo/2017.2.621/kendo.all.min.js"></script>
    <script src="/Scripts/cultures/kendo.culture.fr-FR.min.js"></script>
    <script src="/Scripts/messages/kendo.messages.fr-FR.min.js"></script>
    <script src="/Scripts/kendo/2017.2.621/kendo.aspnetmvc.min.js"></script>
    <script src="/Scripts/kendo.modernizr.custom.js"></script>


    Regards

     

Back to Top