I'd like to be able to select multiple consecutive items by SHIFT + CLICK

There is no way to sort the selected items inside the MultiSelect. 

It would be nice to have such functionality implemented or provide an implementation that can achieve the described functionality.

Currently, the relation between the MultiSelect input and its TagList element (the one that holds the selected items) is established with an aria-describedby attribute. That results in the screen readers to report the selection (all selected items) as one line of text which doesn't adequately describe the control or and its context. The text of each selected item is announced but it is not clear how many items are selected. Also, there is no articulation between each item text that is announced.

Consider and implement better relation/structure, so that the context of the widget (the selected items and their number) is announced clearly.

Bug report

Reproduction of the problem

Reproducible in the demos on mobile devices or in Chrome's emulator.
Screencast.

1. Tap over the MultiSelect input area and drag to scroll the page.

Current behavior

The dropdown opens and a js exception is thrown:

"Ignored attempt to cancel a touchend event with cancelable=false, for example because scrolling is in progress and cannot be interrupted."

Expected/desired behavior

The dropdown does not open (similarly to the way the DropDownList behaves in the same scenario).

Environment

• Kendo UI version: 2019.2.514
• jQuery version: x.y
• Browser: [Mobile Chrome XX ]

Bug report

When an empty array is passed to the MultiSelect's value method inside the deselect event, the item that is deselected remains selected in the MultiSelect.

Reproduction of the problem

1. Open this Dojo and run it
2. Expand MultiSelect's popup list and click on "All" item.

Current behavior

The different MultiSelect items are deselected except for the "All" item.

*If the "if" statement is removed from the deselect event function in the Dojo, and only the 'e.sender.value([]);' is kept, the issue is reproducing no matter of the selected item in MultiSelect's popup.

Expected/desired behavior

Calling 'e.sender.value([]);' should remove all items selected in the MultiSelect.
Click on the "Clear values" button to see the expected behavior.

Environment

• Kendo UI version: 201x.r.ddd
• jQuery version: x.y
• Browser: [all]

Bug report

Reproduction of the problem

Dojo example.

1. Type in "f" in the MultiSelect's input area. It is filtered and shows 2 items in the list.
2. Press "Ctrl + A" keys. The two items are selected.
3. Clear the text in the input. The list is populated with all items in the dataSource.
4. Press "Ctrl + A" keys again

Current behavior

All items are selected, but the first two ("Chai and Chang") are not highlighted as selected.

Expected/desired behavior

All items should be selected and highlighted as selected.

Environment

• **Kendo UI version: 2020.3.1118
• jQuery version: x.y
• Browser: [all]

Bug report

Currently, the MultiSelect input does not have a placeholder attribute in its rendering. This leads to inconsistency with the other input components such as AutoComplete and ComboBox.

Reproduction of the problem

1. Open the Dojo example and inspect the rendering of the two components.

Current behavior

Currently, the MultiSelect 'input.k-input-inner' element does not have a placeholder attribute. As a consequence, the color of the placeholder is slightly different than the rest of the input widgets.

Expected/desired behavior

The MultiSelect widgets should have a placeholder attribute in order to be consistent with the rest of the widgets such as AutoComplete and ComboBox

Environment

• Kendo UI version: 2022.2.510
• Browser: [all]

Hi Team,

I would like to request a built-in functionality to have the Kendo UI MultiSelect to select and deselect all items.  Perhaps a checkbox or specific button within would be great.

Thank you!

Similarly to the feedback listed in https://feedback.telerik.com/kendo-jquery-ui/1560733-multiselect-keyboard-events-bubble-although-already-handled#:~:text=The%20approach%20described%20in%20order%20to%20prevent%2Foverwrite%20the,well%3A%20kendo.ui.MultiSelect.fn._keydown%20%3D%20function%28e%29%20%7B%20e.preventDefault%20%28%29%20%7D%3B

I am exploring using a multiselect box within a window.  If I choose to not allow the multiselect to autoClose, hitting the escape key will close the multiselect, but the event will continue to bubble up and will close the window.  Ideally, the multiselect should close its panel, but the window it is embedded on should not.

One solution to this problem is to add a handler for the close event on the window, however there is currently no way to determine if the close event is being triggered by clicking the close button on the window, or from an escape character (e.userTriggered does not go far enough to differentiate).  I would like the user to be able to click the close button manually to close the dialog, but not necessarily use the keyboard Escape key.  See:  https://docs.telerik.com/kendo-ui/api/javascript/ui/window/events/close

The following solution as mentioned in the feedback link above, can be used to stop the propagation of the Escape key globally, but this then breaks all other keyboard actions (which is bad from a usability standpoint).  Is there any way to add this functionality?  From looking at the source (which we have as part of our subscription), simply adding e.stopPropagation() when responding to the ESC key in the _keydown function of kendo.multiselect.js would be enough to fix this issue.

kendo.ui.MultiSelect.fn._keydown = function (e) {
   if (e.which === 27) {
      e.stopPropagation();
   }
}

Thanks.

Bug report

MultiSelect e.preventDefault() does not work in change event when selecting/deselecting items with Ctrl+A or Chift+Arrow

Reproduction of the problem

• Run the following Dojo: https://dojo.telerik.com/unEhoVAS/3
• Click in the MS input
• Press CTRL+A - all items will be selected

Expected/desired behavior

No items should be selected as e.preventDefault() is called in the select event.

Environment

• Kendo UI version: 2021.1.330
• Browser: [all ]

Hi Team,

I would like to request being able to add new items into the MultiSelect and saving them per user.  

It has become clear that while this control allows a user to add custom entries not currently in the pre-defined list, it appears they can't later be loaded, like when a user saves choices, including custom entries.

I've never seen a scenario where a user enters input into a control and later doesn't need to see what they enter (saved to a Db).

Therefore, the MultiSelect demo which allows you to add custom entries, but can't later display them represents an unrealistic scenario and I recommend at least adding a caveat to the page informing developers planning to use that feature of this limitation.

I like the MultiSelect and use it in many places, but since the custom add feature won't support common usage (later display what they type), I recommend this feature not be displayed as a demo until it's ready.

For example, it should accept as a property a string, delimited by commas, custom entries.

It would then iterate through custom entries and where it doesn't match, add them for you.

Thank you.

• Open the MultiSelect and add some items
• Use backspace to remove items

Result: The items that were selected, then un-selected still show as selected in the list

This can be reproduced on the latest demo page. https://demos.telerik.com/kendo-ui/multiselect/index 

The bug I was talking was when setting tagMode of kendoMultiSelect to single, clicking the clear button (x at right of textbox) doesn’t trigger “deselect” event. Not sure if it’s by design. They fixed a similar bug regarding “change” event - https://github.com/telerik/kendo-ui-core/issues/4649.

Repro snippet could be found at

https://dojo.telerik.com/AHAwETUx

Hello!

Firstly, in the keyboard navigation demo for the MultiSelect widget (https://demos.telerik.com/kendo-ui/multiselect/keyboard-navigation) the follwing two keyboard shortcuts are documented:

• SHIFT + UP-ARROW: select previous item
• SHIFT + DOWN-ARROW: select next item

In the following scenario, these shortcuts cause some strange behaviour:

• select two consecutive items with SHIFT+DOWN-ARROW (e.g. "Small" and "Medium")
• use the arrow keys to move the focus further down (e.g. to "X-Large")
• press SHIFT+DOWN-ARROW again

I would expect "X-Large" and "2X-Large" to be selected in addition to the already selected items "Small" and "Medium". Instead, "Large" is selected as well. Is this behaviour intended?

Secondly, every time the user clicks and selects an entry of the MultiSelect popup, the popup is closed. Is there a way to prevent that closing. Or is there a way of selecting without triggering a close event (like pressing CTRL etc.)?

Thank You!

Bug report

MultiSelect with virtualization scrolls automatically to the first item in the dropdown after selecting items.

Note: the issue is reproduced inconsistently.

Reproduction of the problem

1. Open the Dojo example - https://dojo.telerik.com/oSuTUhiQ/4.
2. Scroll to e.g item 10296.
3. Start selecting all the items down.

Current behavior

At some point, the component will scroll to the top of the dropdown.

Expected/desired behavior

The component should not scroll to the top, the focus should stay on the currently selected item.

Environment

• Kendo UI version: 2020.2.513
• Browser: [all]

Bug report

MultiSelect with virtualization and tagMode: single deselects items when too many items are selected.

Reproduction of the problem

1. Download and unzip the attached project.
2. Run the project.
3. Start selecting items from the first item on.

For convenience, attached is a small video demonstrating the behavior.

Note: So far I was unable to reproduce the issue in a Dojo example when trying to replicate the configuration from the project.

Current behavior

At some point, the dropdown popup will scroll up, and some items that have been selected, will be deselected. Also, the single tag for the selected items will disappear.

Expected/desired behavior

The component should not be deselecting items, should not scroll up and the tag should not disappear.

Attachments:
Project - MultiSelectIssue.zip
Video - Kendosln_Issue.zip

Environment

• Kendo UI version: 2020.1.406
• Browser: [all]

Bug report

The MultiSelect is flickering several times when filtering and then selecting an item in Desktop mode on Safari.

Reproduction of the problem

1. Open the Virtualization demo in desktop mode in Safari on a touch device.
2. Filter the MultiSelect and select an item from the bottom of the filtered list.

Current behavior

The selected item flickers several times. (the selected item disappears and re-appears several times)

Expected/desired behavior

The selected item should not be flickering.

Environment

• Kendo UI version: 2020.3.1118
• Browser: [iOS Safari ]

Bug report

In the MultiSelect widget preventing the default of the filtering event while minLength is set to more than 1 causes the value method to not be able to properly get and set values of the selected dataItems.

Reproduction of the problem

1. Open this Dojo
2. Type Cha and select an item
3. Click the Clear Value button

Current behavior

The Clear Value button is able to clear the selected values but is not updating to visualize the change in the Widget

Expected/desired behavior

The button Clear Value is expected to clear the selected values and visualize the change

Environment

• Kendo UI version: 2020.3.1118
• Browser: [all]