POWER APPS PORTALS – CUSTOM LOOKUP FILTER

A common requirement for Power Apps Portals is to add dynamic filters when we open a lookup modal. Unfortunately there is no OOB way to achieve this. It is important to state here that the Portal relies on the Lookup View from your D365/Dataverse, so if you need a static filter you can always change that view:

In this post I will show a customization using client-side code to filter the data presented on the lookup modal. But before that, I’d like to share an article by a community champion that uses a different method: https://www.youtube.com/@powerappsninja /custom-lookup-filtering-powerapps-portal/ by Oleksandr Olashy.

The idea of the article above is to render the lookup as a dropdown, and then use JavaScript/Web Templates to perform a query and finally re-populate the options in the dropdown element.

That approach will probably be enough for most scenarios, but what if you still need to show the Lookup modal as below?:

Here are a few reasons you might want to display the Lookup modal:

• If your list is a very long list, a dropdown might not be the best experience for the user;
• You might want to use the search;
• You might want to display multiple columns;
• If you have a subgrid and have an action for Associate record, this will always open the lookup-modal.

In my example, I have an Account lookup on the Contact profile form, and the filter I want to do here is hiding certain records if the current user is not an Administrator. I will also add a flag on the Account entity to mark records that should be hidden.

Here is my Account data with no filters via Advanced Find search:

Now I will add the following JavaScript code to the Profile Web Page:

$(document).ready(function() {   
 varlist = $("#parentcustomerid_lookupmodal").find(".entity-lookup").find(".entity-grid").eq(0);   
 list.on("loaded", function() {               
 // hide "Admin Only" column     
   list.find("table thead th").eq(2).hide();       
 list.find("table tbody tr").each(function() { $(this).find("td").eq(2).hide(); });    
    varisAdmin = "{{ user | has_role: 'Administrators' }}";        
console.log("is admin: "+ isAdmin);     
   if(isAdmin == "false") {          
  list.find("table tbody > tr").each(function() {   
   
          vartr = $(this);         
       varadminOnly = $(tr).find('td[data-attribute="cr42c_adminonly"]').attr("data-value");             
   if(adminOnly == "true") {      
              tr.remove();    
            }         
   });       
 }   
 });});

If I open the lookup again via Portals, these are the options that I am presented with:

Let’s explore the JavaScript code:

• I am finding the modal associated with the id parentcustomerid_lookupmodal and injecting a function to the OnLoad event;
• Optionally, I am hiding the Admin Only column, as I want that column to be for technical purposes only;
• Using Liquid, I am checking if the user contains the Administrators role;
• Finally I am looping through the list and checking the value for my Admin Only column, and completely removing the <tr> element in case it’s not supposed to be shown.

Here are a few other business scenarios for which this approach might be applicable:

• Dynamic filter based on a parent record (performing a query via oData or FetchXML to retrieve the related records);
• Filter records on an Associate modal – for this we just need to change how to assign the list variable:

From:

To:

POWER APPS PORTALS – CUSTOM LOOKUP FILTER

https://www.youtube.com/@powerappsninja