Duplicate dropdowns appearing in Editor

4 posts, 0 answers
  1. James
    James avatar
    1 posts
    Member since:
    Sep 2011

    Posted 17 Dec 2012 Link to this post

    Noticed a strange behavior with the editor - when I load it on the page with the tools  "fontName", "fontSize"
     those two dropdowns have a second, duplicate dropdown underneath them. This appears in both Firefox and Chrome.
    if you search on the html snippits below for (inherited size) you'll find it twice.

    I have the Edit control initially hidden on page load and it is revealed on a mouse click. The Editor appears several times inside a tab control and it occurs in each instance...


    <td class="k-editor-toolbar-wrap" role="presentation"><ul class="k-editor-toolbar" role="toolbar" aria-controls="positionOverviewRichText"><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-bold" unselectable="on" title="Bold">Bold</a></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-italic" unselectable="on" title="Italic">Italic</a></li><li class="k-editor-combobox"><span style="" class="k-widget k-combobox k-header k-dropdown k-fontSize" unselectable="on" role="listbox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-busy="false"><span tabindex="-1" unselectable="on" class="k-dropdown-wrap k-state-default"><input class="k-input k-fontSize" type="text" autocomplete="off" tabindex="0" style="width: 100%;" aria-disabled="false" role="combobox" aria-expanded="false" aria-autocomplete="list" aria-busy="false" unselectable="on"><span tabindex="-1" unselectable="on" class="k-select"><span unselectable="on" class="k-icon k-i-arrow-s" role="button" tabindex="-1">select</span></span></span><span unselectable="on" class="k-dropdown-wrap k-state-default"><span unselectable="on" class="k-input">(inherited size)</span><span unselectable="on" class="k-select"><span unselectable="on" class="k-icon k-i-arrow-s">select</span></span></span><select title="Font Size" class="k-fontSize" data-role="combobox" style="display: none;" aria-disabled="false" unselectable="on"><option value="inherit">(inherited size)</option><option value="xx-small">1 (8pt)</option><option value="x-small">2 (10pt)</option><option value="small">3 (12pt)</option><option value="medium">4 (14pt)</option><option value="large">5 (18pt)</option><option value="x-large">6 (24pt)</option><option value="xx-large">7 (36pt)</option></select></span></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-underline" unselectable="on" title="Underline">Underline</a></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-strikethrough" unselectable="on" title="Strikethrough">Strikethrough</a></li><li class="k-editor-colorpicker" role="presentation"><div class="k-widget k-colorpicker k-header k-foreColor" role="combobox" title="Color" data-role="colorpicker" aria-labelledby="positionOverviewRichText_forecolor_cp" tabindex="0"><span class="k-tool-icon" unselectable="on"><span class="k-selected-color" unselectable="on" style="background-color: rgb(0, 0, 0);"></span></span><span class="k-icon k-i-arrow-s" unselectable="on"></span></div></li><li class="k-editor-colorpicker" role="presentation"><div class="k-widget k-colorpicker k-header k-backColor" role="combobox" title="Background color" data-role="colorpicker" aria-labelledby="positionOverviewRichText_backcolor_cp" tabindex="0"><span class="k-tool-icon" unselectable="on"><span class="k-selected-color" unselectable="on" style="background-color: rgb(0, 0, 0);"></span></span><span class="k-icon k-i-arrow-s" unselectable="on"></span></div></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-justifyLeft" unselectable="on" title="Align text left">Justify Left</a></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-justifyCenter" unselectable="on" title="Center text">Justify Center</a></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-justifyRight" unselectable="on" title="Align text right">Justify Right</a></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-justifyFull" unselectable="on" title="Justify">Justify Full</a></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-insertUnorderedList" unselectable="on" title="Insert unordered list">Remove Link</a></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-insertOrderedList" unselectable="on" title="Insert ordered list">Remove Link</a></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-indent" unselectable="on" title="Indent">Indent</a></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-outdent k-state-disabled" unselectable="on" title="Outdent">Outdent</a></li><li class="k-editor-selectbox"><span style="" class="k-widget k-dropdown k-header k-formatBlock" unselectable="on" role="listbox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-busy="false"><span unselectable="on" class="k-dropdown-wrap k-state-default"><span unselectable="on" class="k-input">Paragraph</span><span unselectable="on" class="k-select"><span unselectable="on" class="k-icon k-i-arrow-s">select</span></span></span><select title="undefined" class="k-formatBlock" data-role="selectbox" style="display: none;" unselectable="on"><option value="p">Paragraph</option><option value="blockquote">Quotation</option><option value="h1">Heading 1</option><option value="h2">Heading 2</option><option value="h3">Heading 3</option><option value="h4">Heading 4</option><option value="h5">Heading 5</option><option value="h6">Heading 6</option></select></span></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-createLink" unselectable="on" title="Insert hyperlink">Create Link</a></li><li class="k-editor-button" role="presentation"><a href="" role="button" class="k-tool-icon k-unlink k-state-disabled" unselectable="on" title="Remove Link">Remove Link</a></li></ul></td>
  2. Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 19 Dec 2012 Link to this post

    Hello James,

    Could you create JSBIN where we can observe the issue and search for the reason for that behavior?

    Regards,
    Petur Subev
    the Telerik team
    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. Doug Beard
    Doug Beard avatar
    55 posts
    Member since:
    Sep 2009

    Posted 04 Aug 2014 in reply to James Link to this post

    I'm having the same issue, only I'm using the AngularJS directives.
    Did you find a solution?
  5. Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 05 Aug 2014 Link to this post

    Hello Doug,

    Could you please give us a small runnable demo that demonstrates your case?

    Kind Regards,
    Petur Subev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready