How to add an onload event to a list in Power Apps Portals

In the last months, we had a few requirements targeting the entity list in Power Apps portals. Just to name an example, the request was about showing the time of a date and time field in a list on a form. This is a special case, because the date and time is always displayed in UTC. So if you need to show it in users' local time zone, it might be helpful to go through Mahender Pal's blog post first. 

Normally, the following code snippet is being sufficient to start changing the elements on a page: $(document).ready(function () {});. We discovered that the referenced list isn't completely loaded while this part of the JavaScript logic is triggered and executed. This means that a reference to a cell in a table using [data-attribute=*] won't return anything else than null. To avoid this or the usage of timeout functions, we decided to use the .on() method to attach an on load event to our list element: $("<< listsClassName >>").on("loaded", function () {});. To sum up, this is how it looks like in our case:
 
$(document).ready(function () {
    $(".entity-grid.subgrid").on("loaded", function () {
        //do something with list rows    
    });
});
This is how you get to the class name of your list (please open image in new window): 




#PowerAppsPortal #EntityList #OnLoadEvent