DataProvider cant change the default fetch limit

General
1

Hi,
i would like to change the limit in my below config. But when i manually set the limit to 100 it thows an error

private Component createVirtualList() {
        VirtualList<OrderEntity> list= new VirtualList<>();
        list.setRenderer(new ComponentRenderer<>(CardView::new));
        list.setDataProvider(createPagedDataProvider());
        return list;
    }

private CallbackDataProvider<OrderEntity, Void> createPagedDataProvider() {
        return new CallbackDataProvider<>(
                query -> {
                    List<OrderEntity> orders = fetchOrders(query);
                    if (orders.isEmpty()) {
                        return Stream.of(createEmptyOrder());
                    }
                    return orders.stream();
                },
                query -> {
                    int count = countOrders();
                    return count > 0 ? count : 1;
                }
        );
    }

  private List<OrderEntity> fetchOrders(Query<OrderEntity, Void> query) {
        int offset = query.getOffset();
        int limit = query.getLimit();
        CustomFilter customFilter = new CustomFilter();
        customFilter.setSupplierId(supplierId);
        customFilter.setSearchTerm(searchTextField.getValue());
        customFilter.setStatus(searchStatuses);

        return orderDataProvider
                .fetchFromBackEnd(new Query<>(offset, limit, query.getSortOrders(), null, customFilter))
                .collect(Collectors.toList());
    }

I have tried to set the limit manually like int limit = 50; but then it thows an Error “The data provider hasn’t ever called getLimit() or getPageSize() method on the provided query. It means that the the data provider breaks the contract and the returned stream contains unexpected data.”

With a grid i should set the page size, but i use a Virtual List, there is no way to set the limit.

If i change the limit hardcoded in my query i receive an “The number of items returned by the data provider exceeds the limit specified by the query (25).”

I would really appreciate some input, to get the default limit higher.

2

The limit is the amount of data that the client-side component has requested. The data provider is supposed to just give the client what it ask for rather than try to tell the client that it has asked for the “wrong” amount. The limit may in the generic case vary depending on e.g. a “page size” configured for the component in combination with how many pages of data are visible at the same time with any given user’s screen size. In the case of VirtualList, the page size is not configurable.

It looks like you’re trying to use a paging approach with virtual list, i.e. so that it always shows a given amount of items and then the user can click “next” and “previous” buttons to see other parts of the data. Note that there’s not really any point in using a VirtualList in that case since the whole point of VirtualList is to let the user scroll through data in an efficient way. For paging, you can just manually fetch appropriate items and add them to e.g. Div with a regular for loop.

1 Like
3

You could peek into the grid to see how that sets the page size. It internally sets the page size on the DataCommunicator and some other things. I did not test it myself, but maybe you can reconstruct that manually for the VirtualList (and also create a github issue :) )

1 Like
4

If you want to add pagination to VirtualList, you need to do it in similar way is the example for Grid here shows: Grid component | Vaadin components

However, what you are trying to do is sort defying the idea as VirtualList does not have show all rows model.

So you would need evaluate whether you want actually use single column Grid with component renderer or doing it with some other way, e.g. just having VerticalLayout with X items and buttons for paging etc.

1 Like
5

Ok thank you! Will it be worth a github issue? I think its easier to switch to a one column grid instead of reinventing the wheel :smile: But for me it makes a lot of sense to have lazy loading in a virtual List

Edit: Grid is okay for that with some css to remove the border etc i got the same result

6

As said, both Grid and VirtualList seem to be overkill for what it seems like you’re trying to do. Here’s a simple example that shows 10 items at a time without the overhead of a lazy-scrolling component that doesn’t do any lazy scrolling:

private void renderItems(Div holder, int offset, int limit) {
    List<String> items = IntStream.range(offset, offset + limit)
            .mapToObj(i -> "Item " + i).toList();

    holder.removeAll();
    for (String item : items) {
        holder.add(new Paragraph(item));
    }
}

// Usage:
Div items = new Div();
renderItems(items, 0, 10);
Button nextButton = new Button("Next", click -> {
    currentPage++;
    renderItems(items, currentPage * 10, 10);
});
layout.add(items, nextButton);
7

Thanks for your effor, but i dont have a next button it should scroll infinite like it now does with a one col grid :)

8

Then why do you want to change the limit in the first place rather than just use what VirtualList does by default?