[Resolved] Hiding view if another view returns results

[Author]

Posts

[zachariahC]

Tell us what you are trying to do? I was told earlier that a nested view (Views inside Views) cannot be filtered so I'm trying to find a way around that. Not sure if this is the best way but thought I would see.

On this page: hidden link I have 2 views set up. The top one is the search/select and results of the search/select. The next view are the nested category/posts that show all results by default.

What I would like to do is hide the second view if the search/select returns any results. That way the all results view would be hidden and only the filtered results would be shown.

I was unable to find any similar requests in the forums or support so I'm wondering if I might be trying to approach this in the wrong way. If I am, I'm not sure how to do this.

[Shane]

Hi Zachariah,

Thank you for getting in touch.

We should be able to get this done with some Javascript.

I noticed that you have a custom "No Items Found" wrapped in a strong tag. Could you give that strong tag a custom ID and let me know once you have done so?

This way I can draft up a JS script to help you hide this if the first view returns no results.

Thanks,
Shane

[zachariahC]

Hi Shane. Thanks for the reply.

Based on your response, I just want to confirm that I was clear with my request. Just to make sure I am going to try again. In the attached screen capture I've shown View 1 and View 2. When the search/select form on View 1 is not used (ie reset), I want View 2 to appear.

If the search/select form on View 1 is used and returns results, I want View 2 to be hidden.

If you need the ID in order to change the message to say that there were no results found, then I can see that. I've added the ID "noresults". Just wanted to clarify the rest of it as well. Sorry if this wasn't necessary.

By the way, the toolset section is created by:

[wpv-form-view name="filterable-documents" target_id="self"]
[wpv-view name="filterable-documents" view_display="layout"]
[wpv-view name="document-categories-en"]

[Shane]

Hi Zachariah,

Add this js to your view and let me know if it helps.

jQuery( document ).on( 'js_event_wpv_parametric_search_results_updated', function( event, data ) {
	/**
	* data.view_unique_id (string) The View unique ID hash
	* data.layout (object) The jQuery object for the View layout wrapper
	*/
	if($("#noresults").length) {
  //it doesn't exist
      jQuery( "#wpv-view-layout-2558" ).hide();
}
});

Your second div should hide if the first div returns no results.

Thanks,
Shane

[zachariahC]

I Shane. Thanks for this. That looks simple enough. Unfortunately, it doesn't work. When I come to the page, View 2 is showing, as it should. When I do a search/select I get the matched results AND I get the full results from View 2. This is when View 2 should be hidden. When I hit the search reset button, View 2 disappears and the text contained in #noresults appears. This is the point when View 2 should reappear.

[Shane]

Hi Zachariah,

Ok I get it now.

Change the code to this.

jQuery( document ).on( 'js_event_wpv_parametric_search_results_updated', function( event, data ) {
    /**
    * data.view_unique_id (string) The View unique ID hash
    * data.layout (object) The jQuery object for the View layout wrapper
    */
    if($(".document").length) {

      jQuery( "#wpv-view-layout-2558" ).hide();
}
});

It should resolve the issue now.

Thanks,
Shane

[zachariahC]

Hi Shane and thanks so much. It is working as it should if I do a filtering action. View 2 is hidden. However, if I reset the form, View 2 remains hidden. When the reset button is clicked View 2 should reappear again. You can see what I mean here: hidden link

[Shane]

Hi Zachariah,

Try this.

jQuery( document ).on( 'js_event_wpv_parametric_search_results_updated', function( event, data ) {
    /**
    * data.view_unique_id (string) The View unique ID hash
    * data.layout (object) The jQuery object for the View layout wrapper
    */
    if(jQuery(".document").length) {
      jQuery( "#wpv-view-layout-2558" ).hide();
     }
 if(jQuery("#noresults").length) {
     jQuery( "#wpv-view-layout-2558" ).show();
   }
});

Please let me know if it helps.

If not would you mind allowing me to have admin access to the site so that I can perform proper testing on the code ?

Thanks,
Shane

[zachariahC]

Thanks Shane. Nailed it! That js works great.