How to Add a New Modern List in Power Pages

Dominic Liu, 18 April 2024

The List is the most commonly used component when building Power Pages sites. It is a data-driven configuration that you use to add a webpage that will render a list of records without the need for a developer to surface the grid on a website. By using Lists, you can expose Dataverse records for display on a webpage.

How to Add a New Modern List

The Modern List is still in the Public Preview phase, and the only way to add it is via the Power Pages editor. On your webpage, add a new List by enabling the preview feature. This way, the List you create will be the Modern List.

What’s new for the Modern List

The screenshot above is the new look for the Modern List. Here are some of the features that caught my eye:

1. UI improvements – a better look and feel that brings a better user experience.

2. Infinite Scroll – following the same design as views in Dynamics 365 model driven app. New content automatically loads at the bottom of the list when the users scrolls.

3. Column Filters – By default, filters are available for all columns in the list view. This is such a standard feature, yet it wasn’t available in the classic List.

4. Easy Styling – You can directly change the List style in the Power Pages editor instead of using the CSS.

5. There is a new modern loading experience, which looks much better.

According to Microsoft, the performance for the new Modern List is also improved, but I personally haven’t noticed any significant changes yet. One other things that we are not sure of at this stage is whether this will be a new type of List or a replacement of the existing List. If you are going to update your existing Classic List to this new Modern List, make sure to check if you have any JavaScript or CSS added.

Overall, I really like the new look of the Modern List, especially the design of the new buttons and the view selector, which really elevate the UI to the next level. The new features like the column filter and infinite scroll also bring a nice user experience.