Use the basic usage example from https://www.telerik.com/kendo-angular-ui/components/dropdowns/multiselect/
Click in the area next to the baseball chip.
The list with available objects pops up.
Click in the place where the cursor is, the popup won't close.
Click in the right half of the component, the popup closes.
It seems it's the input element which swallows the click event.
I would expect the popup to be closed, no mather where I click in the component
Currently, given a multiselect with some data and allowCustom = true, if the user types "sm" and hits Enter, the control finds the first item in data that starts with "sm" and automatically selects that.
Repro: https://stackblitz.com/edit/angular-buffxv?file=app/app.component.ts
- Type "sm" in the MultiSelect and hit Enter
- "Small" is automatically selected, valueNormalizer is not hit at all
Looking at the code for the MultiSelect, the auto selection seems to happen because of findIndex(text, startsFrom = 0); the offending line: text && itemText.startsWith(text);
Ideally, the MultiSelect should give me a hook to determine what item is selected. Maybe hit valueNormalizer on Enter
Whenever we type search text in MultiSelect Dropdown and focus out, the search text gets cleared.
Please provide an option for keeping the typed value in the MutliSelect input, without having to select anything from the dropdown.
Provide an option to focus programmatically a multiselect item, in order to prevent the popup list from scrolling when the last item is selected.
Here is an example:
https://stackblitz.com/edit/angular-qpbow1-awhxbr?file=app%2Fapp.component.ts
Before this directive we do it this way:
public ngAfterViewInit() {
const contains = (value: string) => (object: IBaseObjectConfigurationField) => object.name.toLowerCase().indexOf(value.toLowerCase()) !== -1;
this.multiSelect.filterChange
.asObservable()
.pipe(
switchMap(value =>
from([this.collection])
.pipe(
tap(() => {
this.multiSelect.loading = true;
}),
delay(value ? 350: 0),
map(data => data.filter(contains(value))),
),
),
)
.subscribe(x => {
this.filteredCollection = x;
this.multiSelect.loading = false;
});
}
Please provide a (global) option for red line!
We need single tagmode option for multiselect dropdown property in Angualr 2
Hi,
We would like to use the MultiSelect-Control in combination with kendoDropDownFilter and autoClose set to false.
Now when we start typing and hit enter to select a value the filtering text is not cleared and the control is a faulty state.
StackBlitz: https://stackblitz.com/edit/angular-rc2kef?file=src%2Fapp%2Fapp.component.ts
I know this can be done with the change event but that is just a workaround. Would use this from UI for angular.
Provide a way to easily clear the selected values from a multiselect. Similar functionality can be achieved by achieved by setting the value of the multiselect to an empty array, however this does not deselect the items in the dropdown portion of the multiselect, and the items must be clicked twice to reselect them. The clear should function the exact same as the built in clear button.
