Anchor is always visible if dropdownlist defined in overflowTemplate

2 posts, 1 answers
  1. László
    László avatar
    12 posts
    Member since:
    Jul 2008

    Posted 25 Sep 2014 Link to this post

    Hi,

    If i use a dropdownlist in overflowTemplate, then the anchor is always visible:

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>Kendo UI Snippet</title>
     
     
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    </head>
    <body>
       
    <div id="toolbar"></div>
    <script>
        $("#toolbar").kendoToolBar({
            items: [
                { type: "button", text: "Button" },
                { type: "button", text: "Button" },
                { type: "button", text: "Button" },
                { type: "button", text: "Button" },
                  { template: '<div>1234567891</div>', overflowTemplate: '<div><select id="sel"></select></div>' }
            ]
        });
       
      $('#sel').kendoDropDownList({
        dataSource: ['a', 'b', 'c']
      });
    </script>
    </body>
    </html>

    The problem is that the dropdown creates its popup in the popup of the anchor, so the _toggleOverflowAnchor private function finds an element which is not OVERFLOW_HIDDEN (line nr 2):

    01._toggleOverflowAnchor: function() {
    02.    if (this.popup.element.children(":not(." + OVERFLOW_HIDDEN + ")").length > 0) {
    03.        this.overflowAnchor.css({
    04.            visibility: "visible",
    05.            width: ""
    06.        });
    07.    } else {
    08.        this.overflowAnchor.css({
    09.            visibility: "hidden",
    10.            width: "1px"
    11.        });
    12.    }
    13.},

    Regards,
    Laszlo Jakab
  2. Answer
    Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 26 Sep 2014 Link to this post

    Hello László,

    Thank you for bringing this issue to our attention.
    I pushed a fix for it in Kendo UI Core and the fix will be included in next Kendo UI Professional internal build build which is due to be uploaded next week.

    As a small sign of our appreciation for your discovery I have updated your Telerik points.

    Regards,
    Alexander Valchev
    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
Back to Top