Forum Academy Marketplace Showcase Pricing Features

How To Add "No Results Found" When Search Does Not Yield Results

Hi forum! Quick question - I was wondering how I can get the message “Sorry, no results found” displayed in a search results page when the search does not yield any relevant results. Thanks!

Hi there!

Good question, it’s common inclusion to have a UI element to denote when a list is empty and can be a great help to your users experience of your application.

One way to accomplish this would be to have an additional group below the list’s display in your app that has “Visible on page load” unchecked and “Collapse element height when hidden” checked. In this group you’ll place your content for when the list is empty like a text element “no results found”.

Then you’ll want to add a conditional to this group. The condition here should be something like “Repeating group’s list:first item is empty” to check if the list is empty. The property to change here will be “this element is visible” in the dropdown and that checkbox should be checked. A bonus here would be to add to your condition an “AND” and include a second condition like “Repeating group’s loading is no”. Which ensures this message isn’t displayed when the repeating group is loading it’s results.

This means this group will by default be invisible and take up no vertical height on your page. Then, when the search is complete if there are not items in the list this group will be visible and display to your users that no results were found!

Hopefully this helps or gives you an idea for your own solution!

2 Likes

Hi Colin, this is super helpful! Thanks a lot for your answer - appreciate it!