I am trying to keep the number of keyboard operations to a minimum.
So, the example case: if I have a combobox with 3 values, “Apples”, “Bananas”,“Oranges”: I want to be able to select “Oranges” by entering “O” (the list will be filtered to just one item) and press “Enter”.
Current functionality requires the user to press arrow down to select this item, and then enter. As the user has to go through a lot of combobox values, this is a bit annoying. The comboboxes in my application are using search-based data providers (>100.000 values), using objects.
Any idea on how to “catch” the user pressing enter and select the first item?
This sounds like a configuration option we could add.
If the combo box is also configured to allow custom values, then I don’t think it would be nice to pre-select and pre-fill a value even if there would be just one matching.
If custom values are not allowed, we might always want to pre-select and pre-fill the first matching option. Pre-filling only really works nicely if the filtering is based on “starts with” so that we can leave the pre-filled part of the text value selected and the user can keep on writing to override that pre-filled part.
Pre-selecting (focusing an item in the dropdown) without pre-filling (filling in the text value of the focused item in the input field) is problematic because mixed expectations from the user what will happen when they press Enter: does the currently visible value in the input field get set as the value or the focused item in the dropdown?
In the case of the combobox is allowing custom values, I agree, that is not possible, and it does not make any sense…
In our testing now, I notice that the users did press “enter” and expected the only item left to be selected.
We are picking products, and in may cases thy remember the product number. so what they do, they enter “123456” - the search retrieves the correct (and only) product in the list, and they press enter → nothing selected…
I agree on the case where we still got multiple items left in the list, it might be a bit strange to the user that pressing “enter” selects the first item, but during our testing, it was what the users did… I think it is because it is quite clear to the user that they have written enough letters for the search to return the correct product, and it is on the top of the list…
I did try to use the listener for custom values to “catch the ENTER-keydown” and set the value, but, it seems to me that the server is not really aware of the actual filter and items currently shown, at least I was not able to find anything…
You can use addCustomValueSetListener(event -> setMatchingValue(e.getDetail()));
setMatchingValue(String detail) is a method you need to implement. The detail contains the typed text and can be used to filter the items and set the first item found in setValue(...).
@Jouni: it would be nice to have the matching items also in the event as a List, so we could just pick the first one there.