Deselected option in multiselect not getting focus

1 Answer 10 Views
MultiSelect
Lee
Top achievements
Rank 2
Bronze
Bronze
Bronze
Lee asked on 02 May 2024, 08:54 PM | edited on 02 May 2024, 08:56 PM

In the kendo multiselect, when an item is deselected, it does not take the focus from the previously selected item. For example, 
https://demos.telerik.com/kendo-ui/multiselect/keyboard-navigation

  1. In the demo, select small, medium, and large in that order. 
  2. Open the list and click on small to deselect it.
  3. Open the list and notice that large still has the focus.
  4. The expected behavior is that small would take the focus from large.

Using only the keyboard: 

  1. Press the down arrow to open the list.
  2. Using the down arrow and enter keys, select Small, medium, large, and xlarge in that order.
  3. Using the down arrow and enter keys, deselect medium
  4. Use the down arrow to open the dropdown.
  5. Observe that xlarge is focused. The expected behavior would be that medium is focused.
  6. Now select small and deselect large. Notice that small still has the focus.

 

1 Answer, 1 is accepted

Sort by
0
Martin
Telerik team
answered on 07 May 2024, 10:45 AM

Hello, Lee,

The current behaviour is the expected one as there are cases in which the deselected item might not be present in the list. Such a case would be when there is virtualization enabled. 

Still, if you need to focus the deselected item, in the deselect event you have the e.item parameter, which corresponds to the deselected HTML element in the list. You can try using custom logic to programmatically focus the element in the open event, but we would recommend careful testing for undesired or confusing behaviour.

Regards,
Martin
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Kendo family, check out our getting started resources
Lee
Top achievements
Rank 2
Bronze
Bronze
Bronze
commented on 07 May 2024, 11:24 AM | edited

Your rationale of it possibly not being in the list doesnt make sense. I'm not talking about deselecting it by clicking the x on the chip. Im talking about deselecting it by clicking the actual item in the list. If the item somehow gets removed from the list, the focus should move to the top. Really, every time the list is closed and reopened, I think the focus should go to the -1 position.
Martin
Telerik team
commented on 10 May 2024, 10:26 AM

Hello, Lee,

I was referring to the same scenario to deselect an item from the list. Currently that is how the MultiSelect behave regarding the focus, by design. Still, I consulted on the matter with a developer colleague, and he confirmed the information so far.

Lee
Top achievements
Rank 2
Bronze
Bronze
Bronze
commented on 10 May 2024, 12:00 PM

How would I manually change the keyboard focus to either the -1 or 0 index item in the list so that every time the list is opened the keyboard focus is either on no item (-1) or, if that isn't possible, the first item (0)? The highlighting is distracting for mouse users but necessary for keyboard users. It is also confusing when the user opens the list (when autoclose is ser to false) and the focused item is somewhere random.
Martin
Telerik team
commented on 15 May 2024, 07:25 AM

Hello, Lee,

As we do not recommend overriding the default behaviour, we leave it up to the developer to best decide how to achieve the desired customization. As the component doesn't provide anything specific on that matter, you can use the jQuery methods to focus the item as per your expectations.

Tags
MultiSelect
Asked by
Lee
Top achievements
Rank 2
Bronze
Bronze
Bronze
Answers by
Martin
Telerik team
Share this question
or