[Resolved] Update results of second view based on URL parameters of first view filter

[Author]

Posts

[peterV-10]

Setting:
I have 2 views on a page, both with the same filter ("All / Culture / Offices / Residential"). Only the filter of the FIRST view is visible on the page.
The first view shows the 3 first results (projects).
The second view also shows the projects, but skips the first three.
With NO filter selected, all is okay (first three are displayed in View1, the rest is displayed in View2)

What I want to achieve:
When I check eg. "Culture", first 3 Culture Projects should be displayed in View1 (is ok), and the rest of Culture Projects should be displayed in View2.
(PS. I want to keep using "Update Ajax results when an value changes")

My question: Isn't it possible to achieve this using JS hook "js_event_wpv_parametric_search_results_updated"?
I implemented this hook in my first View successfully (every time I change a value, I get a console message "Okay").
But: I don't know how to refresh the results of View2, based on the parametric URL search.

[Shane]

Hi Peter,

Thanks for getting in touch.
Unfortunately no it wont be possible to do with AJAX enabled.

You will either need to have your view having it's own set of filters or you will need to do a full page refresh.

This is because when you're using AJAX the filter will target the view directly.

Thanks,
Shane

[peterV-10]

Okay - no AJAX, I understand.
Maybe 2 more questions then:
(1) How can I induce a full page refresh just by clicking a filter value of View1 without the need of a "Filter" or "Start search" button?
(2) And how can I change the results of View2 based on the filter values from View1?
Thank you, Shane!

[Shane]

Hi Peter,

Given that Ajax won't be used you will either have to have a submit button added or you can use some JS to submit the form when a value is selected.

Now this Javascript will need to detect when each field is selected. This would require custom coding and this is out of the scope of our support forum to assist with but I can provide some resource for you to use.
https://stackoverflow.com/questions/18135420/jquery-javascript-submit-form-when-checkbox-is-clicked

(2) And how can I change the results of View2 based on the filter values from View1?

How views function is that they are filtered by a URL parameter, so you will need to add your filters to the 2nd view and set each of those filters to be filtered by a URL parameter.

The URL parameter must match the parameters that the first view is submitting in the URL.
https://toolset.com/documentation/user-guides/views/filtering-views-by-custom-fields/#source-for-compare-value

Please let me know if this helps or if further clarification is needed on this.

Thanks,
Shane

[peterV-10]

My issue is resolved now.
The code that did the trick was this:

jQuery(document).on('ready', function() {
  jQuery('.js-wpv-filter-form-340 input[name=wpv-category].js-wpv-filter-trigger').on('change', function(e) {
    $form = jQuery(e.target).closest('form');
    $form.submit();
  });
});

Cheers,
Peter