filter combobox? it works for textfield already

hi i have a grid with some columns and i want to be able to filter each column.

for now i have a textfield, where i type something in and then the grid-column gets filtered for the word i typed in. this also works.

but now i want to replace the textfields with combobox. i want the same functionality tho, i want to be able to type in text into the combobox and that the grid-column gets filtered.

this is what i want for now, how do i that?

later on i want to use the dropdown field of the combobox as well for filtering, but step by step…first i want the above described

das hier ist mein funktionierender code für textfield:

//hier sind meine “Keys”
private static final String KEY_GROUP = “filterGroup”;
private static final String KEY_SYSTEM = “filterSystem”;
private static final String KEY_TAG = “filterTag”;

//hier sind meine Textfields
private TextField filterMyGroup, filterMySystem, filterMyTag;

//hier werden die Keys der Column hinzugefügt
grid.addColumn(EntitySystem::getGroupName).setHeader(gridFilterGroup).setResizable(true).setSortable(true).setHeader(“Group”).setKey(KEY_GROUP);
grid.addColumn(EntitySystem::getSysName).setHeader(gridFilterSystem).setResizable(true).setSortable(true).setHeader(“System”).setKey(KEY_SYSTEM);
grid.addColumn(EntitySystem::getTags).setHeader(gridFilterTag).setResizable(true).setSortable(true).setHeader(“Tag”).setKey(KEY_TAG);

//hier folgen die Methoden fürs Filtern

private void prepareFilterFields() {
HeaderRow headerRow = grid.appendHeaderRow();

filterMyGroup = gridTextFieldFilter(KEY_GROUP, headerRow);
filterMySystem = gridTextFieldFilter(KEY_SYSTEM, headerRow);
filterMyTag = gridTextFieldFilter(KEY_TAG, headerRow);

}

private TextField gridTextFieldFilter(String columnKey, HeaderRow headerRow) {
TextField filter = new TextField();
filter.setValueChangeMode(ValueChangeMode.TIMEOUT);
filter.addValueChangeListener(event → this.onFilterChange());
filter.setWidthFull();
filter.setClearButtonVisible(true);
headerRow.getCell(grid.getColumnByKey(columnKey)).setComponent(filter);
return filter;
}

private void onFilterChange() {
ListDataProvider listDataProvider = (ListDataProvider) grid.getDataProvider();

listDataProvider.setFilter(item -> {
    return checkFilterMatches(filterMyGroup, item.getGroupName())
            && checkFilterMatches(filterMySystem, item.getSysName())
            && checkFilterMatches(filterMyTag, item.getTags() /*!= null ? item.getTags() : null*/);
});

}

private boolean checkFilterMatches(TextField filterField, Object itemValue) {
if (filterField.isEmpty()) {
return true;
}
return itemValue != null && String.valueOf(itemValue).toLowerCase()
.contains(filterField.getValue().toLowerCase());
}

im konstruktor wird folgendes aufgerufen:
prepareFilterFields();

ComboBox sure isn’t designed for that, but you can (ab)use lazy loading functionality to intercept also filters that don’t end up in either selection or addition of new items.

Here is a quick PoC example:

DELETED

Oh man this Discords code formatting. Or my skills…

Using gist instead: Abusing Vaadin ComboBox lazy data binding for filtering other components using ComboBox · GitHub

hello, first thanks for your reply.

the thing is i want 2 types of search:

a) partial text search
b) exact text search

and to realize that i thought combobox is best, because you want to search for something… but you dont know exactly the name, so you can type it in the combox and the grid will already filter what you typed in the combobox (same behaviour as with textfield, the code which i posted above)

at the same time i want the dropdown of the combobox to show all possibilities what there is to chose. and once he chooses a “entry” from THAT dropdown, it should be a “exact text search”

(besides that im open for other ideas how to implement partial & exact text search with only 1 field)

Maybe this add-on could be the best solution? Vaadin Add-on Directory

I have never used that though.

You can probably stay with your approach. Even tho it’s not really intended to be used like such :sweat_smile: we have also a custom combo box search algorithm that can work with a tree like combobox entry where the parent of an entry should be visible if you search for a child or using a special character like $ to search on a specific value within the entry of the combobox and do something if found. (Kinda complex but working since V8 until now with the latest Data Provider APIs)

im not allowed to use addons, because they can result in problems later when the addons dont get updated. but own generated code will always work

where can i find this custom combo box , i wanna try i out

maybe it fits

It’s something I’ve created for my company that I’m not allowed to share :sweat_smile: Matti’s gist is really close to my Implementation and should be a really good starting point

aww fk

the gist unfortunately doesnt work for me, maybe cause im on vaadin14?

and can i not simply just use combobox like a textfield?

it should be possible somehow