• Ritika Agarwal

Add a Clear Filter button in Entity List - Power Apps Portals

In this Blog Post, I will walk through the steps required to add a Clear Filter button on the Metadata Filter of an Entity List in Power Apps Portals.


Problem Statement


How to add an option to clear filters in Entity List in Power Apps Portals? How to clear filter selections in Entity List in Power Apps Portals?


Solution


There is no option that exist out of the box to clear the filters applied on an entity list. We can add the below mentioned script to the Entity List as:


$('<button type="button" class="btn btn-link btn-clear" style="">Reset</button>') .insertAfter('.btn-entitylist-filter-submit').on("click", function() { $('#entitylist-filters select').val(''); $('.btn-entitylist-filter-submit').click(); });


Explanation:


#1: <button type="button" class="btn btn-link btn-clear" style="">Reset</button> : The element that will be added for Reset button.


#2: .insertAfter('.btn-entitylist-filter-submit') : .btn-entitylist-filter-submit identifies the "Filter Results" button and add the Reset button after it.


Note: If you want to inset the button before "Filter Results" button, then you can replace the insertAfter function with insertBefore function.


#3: on("click", function() { : This sets the actions to be carried out when the reset button is clicked.


#4: $('#entitylist-filters select').val(''); : Clear selections on all the controls for filters.


#5: $('.btn-entitylist-filter-submit').click(); : Clicks the Filter Results button.


Note: If you want to clear the search input as well, then you can add the below mentioned script inside the on-click operation of Reset button:

$('div.entitylist-search > input').val('');


Demo


In this post we saw how to remove applied filters on a button click from Entity List in Power Apps Portals. This allows users clear the filtering inputs and reset the search criteria.


I hope this was useful for you. In case of any questions or suggestions, feel free to reach me out on twitter at @agarwal_ritika.

Recent Posts

See All

Change Favicon in Power Apps Portals

In this blog post, I will walk through the steps to set your desired icon on a Power Apps Portal App. Problem Statement How to add an icon to the Power Apps Portal App? How to add an icon for all page

Get All the New Posts to Your Inbox
© 2020. Ritika Agarwal
  • LinkedIn
  • Twitter