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.