Directory

Filtering Grid

Grid that makes it easy to filter its data

View larger

Close

View larger

Close

View larger

Close

The FilterGrid component allows attaching filters to the grid and it's columns which can be used to filter its data. Filtering can be performed in case of both in-memory and backend data.

Filtering In-memory data

The FilterColumn#setFilter() method accepts a Component that will show up in the Grid's header row for the column, and a SerializableBiPredicate<COLUMN_VALUE, FILTER_VALUE> which instructs the Grid to display a given row or not. The BiPredicate is a function that gets two parameters, the value and the filter's value, and returns true (keep the row) or false (filter out the row).

colDateOfBirth.setFilter(new DateField(), (v, fv) -> fv == null || v.isEqual(fv));

In addition, in case the value is of different type than the filter's value, it is possible to provide a value provider which converts the value to a filterable value.

colDateOfBirth.setFilter(
        v -> v.toInstant().atZone(ZoneId.systemDefault()).toLocalDate(),
        new DateField(),
        (v, fv) -> fv == null || v.isEqual(fv));

Filtering backend data

Add Filters to the Grid using the Grid#addFilter() method.

Then, given a backend service that returns a stream of objects (e.g. from database or REST service) public Stream<Person> getPersonsFilteredByFirstName(int offset, int limit, String firstNameContains) {/* ... */}, create a filtered data provider which uses this service for fetching and counting data.

grid.setFilteredDataProvider(
        (sortOrder, filters, offset, limit) -> PersonService.getInstance()
                .getPersons(offset, limit, filters.getStringValue("filterFirstName")
                        .orElse(null)),
        filters -> PersonService.getInstance().getSize(
                filters.getValue("firstName", String.class)
                        .orElse(null)));

For more detailed documentation, please visit https://github.com/wbadam/filtering-grid

Sample code

// Create the Grid component
FilterGrid<Person> grid = new FilterGrid<>();

// Add columns to the Grid
FilterGrid.Column<Person, String> colFirstName = grid.addColumn(Person::getFirstName);
FilterGrid.Column<Person, LocalDate> colDateOfBirth = grid.addColumn(Person::getDateOfBirth);
FilterGrid.Column<Person, Continent> colContinent = grid.addColumn(Person::getContinent);
FilterGrid.Column<Person, Float> colBalance = grid.addColumn(Person::getBalance);

// --- Filters ---

// Add a text field to the header to filter the firstName column.
// Data that contains the filter text regardless of case will be displayed.
colFirstName.setFilter(
        new TextField(), StringComparator.containsIgnoreCase());

// Add a filter for dateOfBirth
// The Grid will display rows that have birth date equal to the one set in the filter
colDateOfBirth.setFilter(
        new DateField(), (v, fv) -> fv == null || v.isEqual(fv));

// Add a combo box to filter the continent column
colContinent.setFilter(
        new ComboBox<>("", Arrays.asList(Continent.values())),
        (cValue, fValue) -> fValue == null || fValue.equals(cValue));

FilterGrid<Person> grid = new FilterGrid<>(Person.class);

// Create String filter by giving it a key and a component, then add it to the Grid
StringFilter<TextField> filter = new StringFilter<>("filterFirstName", new TextField());
grid.addFilter(filter);

// Use the special data provider to receive all given filters as FilterCollection
grid.setFilteredDataProvider(
        (sortOrder, filters, offset, limit) -> PersonService.getInstance()
                .getPersons(offset, limit, filters.getStringValue("filterFirstName")
                        .orElse(null)),
        filters -> PersonService.getInstance().getSize(
                filters.getValue("firstName", String.class)
                        .orElse(null)));

Links

• Source Code

Compatibility