40
Views
3
Comments
Solved
List Widget Not Loading Full Results
Question
Application Type
Reactive

There's an aggregate in the web block that fetches all the child records of the input parameter parent ID. In the Network tab in the browser dev tools I can see the aggregate is returning all the records, but the list widget only loads a little more than half. This only seems to happen when the window is at max width. If I make the window smaller and refresh the page, the list widget loads all the records. If I make the page max width at this point I can see all the records. But if I refresh the page when it's at max width the same issue occurs.

The list widget is enclosed in three higher containers that have the following CSS applied:

Highest container:
margin-bottom: 50px;
text-align: center;

Container just above the List widget:
text-align: left;

Has anyone else experienced this? How do I fix it?

I can't use pagination. This is a transcript editing app and users need to be able to always see what's above and below the paragraph they're working on.

2022-11-14 17-25-57
Daniel Johnson
Solution

In the List widget properties adding the disable-virtualization attribute and setting it to True fixed the issue.

https://success.outsystems.com/documentation/11/reference/outsystems_language/interfaces/designing_screens/list/

2022-11-14 17-25-57
Daniel Johnson

Underneath the last item in the list this script tag is loading empty space

It's inside the same div as the List widget. 

And if I resize the dev tools and make it bigger, the hidden list items load and stay loaded.

2022-11-14 17-25-57
Daniel Johnson
Solution

In the List widget properties adding the disable-virtualization attribute and setting it to True fixed the issue.

https://success.outsystems.com/documentation/11/reference/outsystems_language/interfaces/designing_screens/list/

2021-09-06 15-09-53
Dorine Boudry
Ā 
MVP

This is great šŸ˜„

Give it an hour and the problem goes away by itself.

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.