如何在Vaadin 8中添加网格filter？

瓦丁8刚刚出来。 在Grid中添加filter从来没有在他们的文档中，我只在stackoverflow中找到了一个有用的解决方案。

HeaderCell cell = filterRow.getCell(pid); // Have an input field to use for filter TextField filterField = new TextField(); filterField.setColumns(0); filterField.setHeight("23"); // Update filter When the filter input is changed filterField.addTextChangeListener(change -> { // Can't modify filters so need to replace b.removeContainerFilters(pid); // (Re)create the filter if necessary if (! change.getText().isEmpty()) b.addContainerFilter( new SimpleStringFilter(pid, change.getText(), true, false)); }); cell.setComponent(filterField); 

但是现在自更新以来，此解决方案不再有效，因为SimpleStringFilter在新网格中不再可用，并且BeanItemContainer不再被识别，只允许setItems（）填充网格数据。

任何人都可以帮我更新Vaadin 8的代码吗？

Answer 1

可以为Vaadin 8 Grid添加过滤function。

假设我们已将Person模型定义为：

 final class Person { private String name; public Person(String name) { this.name = name; } public String getName() { return name; } } 

我们的Grid实现如下所示：

 final class PersonGrid extends Grid { public PersonGrid() { List persons = new ArrayList<>(); persons.add(new Person("foo")); persons.add(new Person("bar")); persons.add(new Person("foobar")); addColumn(Person::getName).setCaption("Name"); setItems(persons); } } 

现在，我们可以使用TextField创建一个布局，它将成为我们的filter：

 final class FilteredGridLayout extends VerticalLayout { private final PersonGrid personGrid; private final TextField nameFilter; public FilteredGridLayout() { nameFilter = new TextField(); nameFilter.setPlaceholder("Name..."); nameFilter.addValueChangeListener(this::onNameFilterTextChange); addComponent(nameFilter); personGrid = new PersonGrid(); addComponentsAndExpand(personGrid); } private void onNameFilterTextChange(HasValue.ValueChangeEvent event) { ListDataProvider dataProvider = (ListDataProvider) personGrid.getDataProvider(); dataProvider.setFilter(Person::getName, s -> caseInsensitiveContains(s, event.getValue())); } private Boolean caseInsensitiveContains(String where, String what) { return where.toLowerCase().contains(what.toLowerCase()); } } 

结果如下所示：

对于空输入结果是： foo ， bar和foob​​ar 。

对于foo，结果是： foo和foo bar。

对于酒吧结果是： 酒吧和foo 酒吧 。

对于foob​​ar结果是： foob​​ar 。

Answer 2

有Vaadin网格插件将在稍后移植到Vaadin 8，所以如果你有时间等待它，你可以在漂亮的包中获得filter行。

https://vaadin.com/directory#!addon/gridutil

请阅读GridUtil作者的努力估算。

https://github.com/melistik/vaadin-grid-util/issues/37#issuecomment-282756130