The https://feedback.telerik.com/blazor/1517344-filter-text-is-cleared-when-you-select-an-item ticket fixed a good usability issue with multiselect. Unfortunately, it creates a bug I ran into while starting to update my applications MultiSelects.
If you have PersistFilterOnSelect=true property set, but not AutoClose=false what happens is the user types '2' to filter the selection, selects something with the mouse and the drop down closes, but the filter doesn't clear so when next trying to select an item the old filter is still there, although it's not showing. The only way to clear the ghost filter seems to be to start typing a new thing to filter on and then backspace that which finally removes the ghost.
The docs kind of mention this with "To keep the filter upon selection, set the PersistFilterOnSelect parameter to true. It only applies when Filterable="true" and AutoClose="false"" but the ghost filter staying is clearly a bug. You can test this behaviour with a repl I made. Click the multiselect active, type for.ex. '2' and select an item with the mouse, the item is selected, the dropdown closed and the filter vanishes. Now click the multiselect again, the dropdown is already filtered as if '2' had been pressed, but it's not visible and can't be cleared without typing a new filter
Below is a screenshot where I typed 22 as the filter, selected Item 22 and then clicked the MultiSelect again
This appears to be documented behavior, but it also seems to me like this is something that the component should be handling.
When using row virtualization with a Grid, a DropDownList, a MultiSelect, etc, the OnRead is called for every scroll event, regardless of whether the component _actually_ needs to fetch new data or not.
For example: A DropDownList with a PageSize of 100, but with only 10 items visible in the dropdown at a time will ask for 100 records every time the user even scrolls 1 record down. This results in many requests to the backend server, with many of the results being the majority of the contents from the previous request.
I have worked around this by implementing a buffer that keeps results for me and returns them as the user scrolls, only requesting for more from the backend server when the buffer runs out, but this feels like something that the components themselves should be handling.
If this is expected behavior, all good. Just wanted to raise some awareness on it.
When user is inside list of selected options/items, navigating amongst the items with keyboard left/right keys, it states "item # of # of items of level 1".
what is "of level 1"? (is items selected in level 1 and level 2 is the text editable section?)
i am expecting the screen reader to state item "<value/label/title>" when i set focus to an item via keyboard left or right.
The issue did not occur in firefox. Sorry, i have not provided the firefox readout w/ the screen reader for comparison.
however, for the most likely user scenario the behaviour with the screen reader is correct.
if keyboard focus is on text edit, and u leave the component (w/ tab key), when revisiting the component (w/ shift+tab keys) all selected items are read out correctly
tested in Chrome and firefox using NVDA.
In drop down panel colour indicates which option has been selected (is it the dark colour or is the light colour). Suggestion: having an icon of tick would assist.
As an alternative option - Blazor MultiSelect - Templates | Telerik UI for Blazor this would be great if you could template selected and non-selected items, but at the moment there is just the one item template.