[Resolved] Hide 'No Items Found Text' until search performed

[Author]

Posts

[simonC-7]

Tell us what you are trying to do?
I am using this code to hide results until the user enters a search filter: https://toolset.com/forums/topic/dont-show-any-results-until-filter-is-applied/

It works well. However of course, it shows the 'No Items Found Text'.

I would like it to show nothing until the search has been performed, then if there are no search results the 'No Items Found Text' can show.

Is this possible somehow please?

Is there any documentation that you are following?
No, I can't see any

Is there a similar example that we can see?
hidden link

What is the link to your site?
hidden link

[Waqar]

Hi,

Thank you for contacting us and I'd be happy to assist.

To achieve this, you can include some custom CSS code conditionally, so that it only works, when the search form has been submitted.

You'll note that once the search form has been submitted, some URL parameters are appended to the URL, for example:
?wpv_view_count=1546&toolset_maps_distance_radius=5&toolset_maps_distance_unit=mi&toolset_maps_distance_center=&wpv_filter_submit=Find+an+Expert

You can use a conditional statement, that checks for the availability of one of the common URL parameter 'wpv_view_count':
https://toolset.com/documentation/legacy-features/views-plugin/conditional-html-output-in-views/
https://toolset.com/documentation/programmer-reference/views/views-shortcodes/#wpv-search-term

[wpv-conditional if="( '[wpv-search-term param="wpv_view_count"]' eq '' )"]
...
[/wpv-conditional]

So, anything enclosed within this conditional statement will only become part of the page, when the value of the URL parameter 'wpv_view_count' is empty (which will mean that the search form has not been submitted).

The final code with the conditional statement and CSS code to hide the view's search results container (including the 'no items found text') will look like this:

[wpv-conditional if="( '[wpv-search-term param="wpv_view_count"]' eq '' )"]
 
<style>
.js-wpv-view-layout-1546 {display:none;}
</style>
 
[/wpv-conditional]

You can include this code under the no items found text in the view's settings.
( example screenshot: hidden link )

I hope this helps and please let me know if you need any further assistance with this.

regards,
Waqar

[simonC-7]

My issue is resolved now. Thank you!

The conditionals are powerful. I can imagine them being handy in other circumstances too.