Window Custom Icon

5 posts, 1 answers
  1. Marc
    Marc avatar
    171 posts
    Member since:
    Sep 2016

    Posted 19 Dec 2016 Link to this post

    Hi, I've added some custom icons as specified in your docs. I have added this icon .k-i-arrow-n.

    However, some content inside my window also has that class (Kendo Dropdowns).

    I have added a function to this class using the demo in your docs - window.wrapper.find(".k-i-arrow-n").click(function (e) { - but this function runs when I click the dropdown buttons as well.

    Is there a way to resolve this please?

  2. Ori
    Ori avatar
    23 posts
    Member since:
    Feb 2015

    Posted 20 Dec 2016 in reply to Marc Link to this post

    Hello Marco!

    Have you tried window.wrapper.find(".k-i-arrow-n:first")... ?

  3. Marc
    Marc avatar
    171 posts
    Member since:
    Sep 2016

    Posted 20 Dec 2016 in reply to Ori Link to this post

    Hi Ori!

    I hadn't - I'm awful at jQuery! I guess this would work fine though. Thanks!

    My solution was to find the window action area first - .window.wrapper.find(".k-window-actions").find(".k-i-arrow-n")

    I think Kendo should maybe add this as an alternative in their documents - it guarantees that you only check the icon area.

    Thanks again!

     

  4. Marc
    Marc avatar
    171 posts
    Member since:
    Sep 2016

    Posted 20 Dec 2016 in reply to Ori Link to this post

    Hey!

    No I hadn't - I'm awful at jQuery!

    Thanks though - I'm sure this will work! I found the icon area first - .window.wrapper.find(".k-window-actions").find(".k-i-arrow-n")

    I think Kendo should add this to their docs, as it guarantees that you only check the icon area for the custom icon.

     

  5. Answer
    Stefan
    Admin
    Stefan avatar
    2909 posts

    Posted 21 Dec 2016 Link to this post

    Hello Marc,

    Thank you for the suggestion.

    This is not added, as there are many different elements which can be selected via jQuery in our widgets and providing the selectors for all of them can be very confusing when searching the relevant information.

    We have an article describing the naming convention used for our widgets, so it can be easier to find and select the desired element:

    http://docs.telerik.com/kendo-ui/styles-and-layout/appearance-styling#common-css-classes

    Still, we will consider adding more example based on the community demand.

    And I would like to thank Ori for providing the needed information.

    Regards,
    Stefan
    Telerik by Progress
    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.
Back to Top