Z-Index Problem with Dropdownlist in Window

3 posts, 0 answers
  1. Harlan
    Harlan avatar
    19 posts
    Member since:
    Dec 2014

    Posted 03 Nov 2015 Link to this post

    We have a Dropdownlist in a Window that gets a wrong Z-Index. We haven't been able to duplicate this problem in Dojo so we know it's likely an issue with how we have something setup. However, we're not sure where to start looking.

    The Window gets a z-index of 10003 and the dropdownlist gets a z-index of 10002, which positions it behind the window.

    We are using angular-kendo if that makes any difference.

  2. Dimo
    Dimo avatar
    8472 posts

    Posted 05 Nov 2015 Link to this post

    Hello Harlan,

    We are not aware of the described problem. Normally, the DropDownList will calculate the required z-index for its dropdown, based on the stacking context the widget is placed in. Can you share the Window configuration and some other relevant code? Do you by any chance have enforced z-index styles on any Kendo UI elements via custom CSS code?

    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Harlan
    Harlan avatar
    19 posts
    Member since:
    Dec 2014

    Posted 02 Dec 2015 Link to this post

    We found that the DropDownList was being initialized before the Window. The solution was to use k-ng-delay on the DropDownList and reference the window it was embedded in.

    We found our solution in the documentation on "nesting widgets". The example given there is for a tab strip, but we aren't having the issue on tab strips, only when we use widgets inside Kendo Windows.

    In answer to Dimo's question, we did not have any enforced z-index styles in our CSS that effected our DropDownList.

Back to Top