Tooltip for Kendo UI Grid using AngularJS

7 posts, 0 answers
  1. SK
    SK avatar
    3 posts
    Member since:
    Nov 2014

    Posted 29 Apr 2015 Link to this post

    Hi,

        I am looking for any example on how to show the Tooltip for a Kendo UI Grid column cell using the AngularJS. I saw many examples of this in the regular jQuery mode. I'm particularly interested in the AngularJS sample.

     Thanks,

    SK

  2. Peter Filipov
    Admin
    Peter Filipov avatar
    1028 posts

    Posted 01 May 2015 Link to this post

    Hi,

    Please review the following example, it shows how to handle the described case.

    Regards,
    Peter Filipov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. SK
    SK avatar
    3 posts
    Member since:
    Nov 2014

    Posted 01 May 2015 Link to this post

    Thanks Peter. I am seeing the Tooltip now, but running into a small issue. I am showing contents from a " Kendo Editor" control into a Grid (Cell). The Tooltip is needed to show the content of the first grid cell. The example you provided does the work sort of. When the content of the grid cell is large, it extends beyond the tooltip area (width and height). Is there a way I can resize the Tooltip dimension dynamically or at least when the content is beyond certain length. Thanks in advance.

     

    Thanks,

    SK

     

  5. SK
    SK avatar
    3 posts
    Member since:
    Nov 2014

    Posted 04 May 2015 Link to this post

    Peter,

           Thanks for the sample. I am looking for a way to dynamically set the height / width of the Tooltip depending on the content size.    How can I achieve that?

           Second question, I noticed that tooltip size seems to get fixed depending on the first content you are displaying and subsequent rendering of the tooltip uses the same width irrespective of the content. How can I prevent this.

     

    Thanks,

    SK

  6. Peter Filipov
    Admin
    Peter Filipov avatar
    1028 posts

    Posted 05 May 2015 Link to this post

    Hello,

    By default the size of the tooltip is determined by its content e.g. here. Could you please send me a sample in dojo where I could observe the described issue? I have updated the sample to show case how to set different width on the tooltip.

    Regards,
    Peter Filipov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  7. Swetha
    Swetha avatar
    1 posts
    Member since:
    Jul 2016

    Posted 15 Jul in reply to Peter Filipov Link to this post

    Hi,

    I am using kendo-2014.1.416 library. The sample example that you have provided is not working to show a tooltip for a specific column's cells in grid. KendoUI using AngularJs.

    Regards,

    Swetha Pullur

  8. Ianko
    Admin
    Ianko avatar
    1535 posts

    Posted 19 Jul Link to this post

    Hello Swetha,

    Typically, it is suggested to use the latest possible version of Kendo UI. This way you get bug fixes, new features and improvements. Also, note that the the versions supported are the ones published after a major release. 

    I was unable to exactly test with 2014.1.416. So, I tested with 2014.2.716. Where the Grid appears to have different rendering and this line is throwing an error: var grid = e.target.closest(".k-grid").getKendoGrid();.

    In order to resolve, you should ensure that the Grid instance is properly returned. So, using code like this one should resolve the issue: var grid = e.target.closest("[data-role='grid']").data("kendoGrid");. Here you are a new Dojo: http://dojo.telerik.com/arISu.

    Regards,
    Ianko
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
Back to Top
Kendo UI is VS 2017 Ready