Kendo-angular: DropDownList fires valueChanged event when popup is closed with Esc button or blur

Created on 26 Jan 2018 · 3Comments · Source: telerik/kendo-angular

I'm submitting a...

Bug report

Current behavior

Despite DropDownList's documentation, the current highlighted value is selected even when popup is closed by Esc button or control's blur.

Expected behavior

the value should be selected only by direct click on the option in the popup or with the enter or the tab keyboard button.

e.g.

I open the options popup, I navigate with arrows and select a value A with enter.
I reopen the options popup, I navigate with arrows until value B and I close the popup clicking away from it (or pressing Esc)

The selected value should be A, but it's B because the valueChanged event is fired anyway on the popup closing

Minimal reproduction of the problem with instructions

Code on dropdownlist page -> https://www.telerik.com/kendo-angular-ui/components/dropdowns/dropdownlist/#toc-common-usage

https://plnkr.co/edit/hzG9QEseDdDQCBKsOQWm?p=preview

What is the motivation or use case for changing the behavior?

Better user experience and keyboard navigation

Environment

Browser:

Chrome (desktop) version 64.0.3282.119
Firefox version 58.0 (64 bit)

Question dropdowns

Source

ghost

Most helpful comment

done

ghost on 30 Jan 2018

👍2

All 3 comments

@fgiomi the current behaviour mimics the behaviour of the native select element on Windows. The expected behaviour that you described can be observed with native select element on OS X.

It is arguable which of the two is the correct one.

On Windows (and in the component) the selected value is changed during navigation. There is a visual indication that the selection is changed, both in the popup list and in the component's header.

On OS X the popup of the native select element covers the input header, during navigation the selection (tick mark) is not changed until the user explicitly selects the item. There is no visual indication that the value is changed before it is selected via click or enter.

Such change in the behaviour will be a breaking change in the component, which is why we cannot publish it as a simple fix. I suggest to submit a request on Kendo UI for Angular feedback portal. This will allow us to track how many users are interested in this behaviour change.