Progress® Kendo UI® for jQuery Feedback Portal
Back to Feed
Request a Feature Report a Bug
Declined
Last Updated: 16 Dec 2021 10:41 by ADMIN
Michael D
Created on: 01 Dec 2021 13:40
Category: Kendo UI for jQuery
Type: Bug Report
0
Editor: Adding a tooltip changes the behavior of DropDownList, ColorPicker etc.

The behavior of DropDownList, ColorPickers and probably more controls changes when a tooltip is added to them. When the tooltip opens, the ".k-state-border-down" CSS-class is added to the (e.g. DropDown) container. However, in the context of the DropDown, this class means that the DropDown is opened and therefore, the styling changes accordingly.

The following two DOJOs demonstrate this bug:

We currently experience this behavior in the Editor widget when adding tooltips to tools that render the aforementioned controls.

3 comments
ADMIN
Neli
Posted on: 16 Dec 2021 10:41

Hi Michael,

As mentioned previously, the described behavior is expected, as the .k-state-border-down class will be added to the Tooltip target.

If you would like to customize the appearance you could remove the '.k-state-border-down ' class when the Tooltip is displayed as demonstrated below:

show: function() {
          $('.k-dropdown-wrap').removeClass('k-state-border-down');
}

Here is the modified Dojo example. 

Regards,
Neli
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Michael D
Posted on: 09 Dec 2021 12:25

Hi Neli!

 

Thank you for your response.

I have tried out the dojo you provided, however, when looking closely, you can still see the .k-state-border-down class of the tooltip changing the appearance of the DropDownList (look at the bottom borders).

The problem I wanted to point out is that the tooltip adds a class to DOM elements that belong to a DropDownList and that it influences its appearance. In my humble opinion, that is some kind of interference that should not happen. Please correct me if I am wrong.

 

Kind regards, Michael

ADMIN
Neli
Posted on: 08 Dec 2021 13:15

Hi Michael,

The described class will be applied on the target when it is hovered and the Tooltip is displayed. You could inspect the Tooltip Index demo where the ".k-state-border-down" is added to the <span> elements when they hovered. 

In a scenario with DropDownLists, you could try to use 'k-dropdown-wrap' class for the filter. Here is the modified Dojo example. 

I hope this helps.

Regards,


Neli
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Create an account Log In
View
Type
Status
Category