[Resolved] Views Parametric Filter Sorting / Selections no Longer Working with Views 3.0.1

[Author]

Posts

[BD]

I created a parametric search filter for one of our websites a year or so while ago that has always worked fine:
hidden link
The selections, sorting filters and comparison filters work perfectly on the current site.

We have been redesigning the website theme but have retained the same view with just stylistic changes. I have just updated to Views 3.0.1 and the whole thing has broken. I have spent hours rebuilding the view from scratch to try and troubleshoot it, but I just cannot get it to work and need help please.

When the archive page loads. all seems fine. But as soon as any of the filters are altered, the view returns zero results, no matter what. Also, the sorting filters don't work. These actually stopped working with the last version of Views - I only just noticed it now though. The Min / Max filters compare using a number and I have checked that every post has a number in this field. Same with 'Guests'.

When the RESET button is clicked, the page loses its order and the posts are listed in a completely different order. Similarly, the order of the posts in the 'Yacht Name' dropdown also loses its order.

In addition, the Ajax 'infinite scroll' pagination returns zero results as soon as the first refresh occurs.

I can supply the dev site location, name of the view and front end password in a private message.

Filter Code:

[wpv-filter-start hide="false"]
[wpv-filter-controls]
<div class="wrap" id="wrap">
<div id="yachtsearchfilters" class="yachtsearchfilters"> 
 
<div class="grid-x grid-padding-x">
    
     <div class="form-group small-6 large-2 cell">
	<label>[wpml-string context="wpv-views"]Sail or Motor[/wpml-string]</label>
	[wpv-control-postmeta field="wpcf-sail-or-motor" type="select" default_label="All" url_param="wpv-wpcf-sail-or-motor"]
</div>

<div class="form-group small-6 large-2 cell">
	<label>[wpml-string context="wpv-views"]Yacht Type[/wpml-string]</label>
	[wpv-control-post-taxonomy taxonomy="yacht-type" type="select" default_label="All" url_param="wpv-yacht-type"]
</div>

<div class="form-group small-6 large-2 cell">
	<label>[wpml-string context="wpv-views"]Cruising Area[/wpml-string]</label>
	[wpv-control-postmeta field="wpcf-primary-cruising-area" type="select" default_label="All" url_param="wpv-wpcf-primary-cruising-area"] 
</div>

<div class="form-group small-6 large-2 cell">
	<label>[wpml-string context="wpv-views"]Min Charter Price p/w[/wpml-string]</label>
	[wpv-control-postmeta display_values="€0,€20%%COMMA%%000,€40%%COMMA%%000,€60%%COMMA%%000,€80%%COMMA%%000,€100%%COMMA%%000,€120%%COMMA%%000,€140%%COMMA%%000,€160%%COMMA%%000" values="0,20000,40000,60000,80000,100000,120000,140000,160000" field="wpcf-charter-price-guide" type="select" source="custom" url_param="wpv-wpcf-charter-price-guide_min"]
</div>
<div class="form-group small-6 large-2 cell">
	<label>[wpml-string context="wpv-views"]Max Charter Price p/w[/wpml-string]</label>
	[wpv-control-postmeta values="1000000,20000,40000,60000,80000,100000,120000,140000,160000,1000000" display_values="Any,€20%%COMMA%%000,€40%%COMMA%%000,€60%%COMMA%%000,€80%%COMMA%%000,€100%%COMMA%%000,€120%%COMMA%%000,€140%%COMMA%%000,€160%%COMMA%%000,Over €160%%COMMA%%000" field="wpcf-charter-price-guide" type="select" source="custom" url_param="wpv-wpcf-charter-price-guide_max"]
</div>
<div class="form-group small-6 large-2 cell">
	<label>[wpml-string context="wpv-views"]Total Guests[/wpml-string]</label>
	[wpv-control-postmeta field="wpcf-total-guests-sleeping" type="textfield" url_param="wpv-wpcf-total-guests-sleeping" placeholder="Number of Guests"] 
</div>
    
</div><!-- row -->
  
  <div class="grid-x grid-padding-x">
    
    <div id="sorting" class="small-12 medium-6 cell">
  [wpv-sort-orderby type="select" options="field-wpcf-charter-price-guide,field-wpcf-total-guests-sleeping" label_for_field-wpcf-charter-price-guide="Price" label_for_field-wpcf-total-guests-sleeping="Guests" orderby_as_numeric_for="field-wpcf-charter-price-guide,field-wpcf-total-guests-sleeping" orderby_ascending_for="field-wpcf-charter-price-guide,field-wpcf-total-guests-sleeping"][wpv-sort-order type="select" options="asc,desc" label_for_asc="Ascending" label_for_desc="Descending" label_asc_for_field-wpcf-charter-price-guide="Ascending" label_desc_for_field-wpcf-charter-price-guide="Descending" label_asc_for_field-wpcf-total-guests-sleeping="Ascending" label_desc_for_field-wpcf-total-guests-sleeping="Descending"]
      <small><strong>[wpv-found-count] Classic Yachts Found</strong></small>
    </div><!-- sorting -->
    
<div class="form-group small-12 large-2 cell">
 <form>
<select onChange="window.location.replace(this.options[this.selectedIndex].value)">
  <option value="" selected="selected" class="">Select Yacht by Name:</option>
 [wpv-view name="Search Yachts by Name View" order="ASC" order_by="title"]
</select>
</form>
</div>
    
    <div class="small-6 large-2 cell">[wpv-filter-reset class="button expanded yachtfilterbutton"]</div>
<div class="small-6 large-2 cell">[wpv-filter-submit class="button expanded yachtfilterbutton"]</div>
</div><!-- row -->
  
</div><!-- yachtsearchfilters -->
</div><!-- wrap -->
<!-- https://stackoverflow.com/questions/23081656/fixing-an-element-when-it-reaches-the-top-of-the-page -->
<!-- https://stackoverflow.com/questions/11365091/jquery-scroll-to-anchor-minus-set-amount-of-pixels -->
[/wpv-filter-controls]
[wpv-filter-end]

JS Editor Code (to fire certain functions after Ajax refresh):

jQuery( document ).on( 'js_event_wpv_pagination_completed', function( event, data ) {
	/**
	* data.view_unique_id (string) The View unique ID hash
	* data.effect (string) The View AJAX pagination effect
	* data.speed (integer) The View AJAX pagination speed in miliseconds
	* data.layout (object) The jQuery object for the View layout wrapper
	*/
  jQuery('.wrap').addClass('affix');
  jQuery('.wraplistings').addClass('affix');
  
  // <em><u>hidden link</u></em>
	$(document).foundation();
Foundation.reInit('equalizer');
});
jQuery( document ).on( 'js_event_wpv_parametric_search_triggered', function( event, data ) {
	/**
	* data.view_unique_id (string) The View unique ID hash
	* data.form (object) The jQuery object for the View form
	* data.update_form (bool) Whether the custom search form will be updated
	* data.update_results (bool) Whether the custom search results will be updated
	*/
	 // <em><u>hidden link</u></em>
	$(document).foundation();
Foundation.reInit('equalizer');
});
jQuery( document ).on( 'js_event_wpv_parametric_search_started', function( event, data ) {
	/**
	* data.view_unique_id (string) The View unique ID hash
	*/
	 // <em><u>hidden link</u></em>
	$(document).foundation();
Foundation.reInit('equalizer');
});
jQuery( document ).on( 'js_event_wpv_parametric_search_form_updated', function( event, data ) {
	/**
	* data.view_unique_id (string) The View unique ID hash
	* data.view_changed_form (object) The jQuery object for the View form after being updated
	* data.view_changed_form_additional_forms_only (object) The jQuery object containing additional forms from other instances of the same View inserted using the [wpv-form-view] shortcode
	* data.view_changed_form_additional_forms_full (object) The jQuery object containing additional forms from other instances of the same View inserted using the [wpv-view] shortcode
	*/
	 // <em><u>hidden link</u></em>
	$(document).foundation();
Foundation.reInit('equalizer');
});
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
	*/
	 // <em><u>hidden link</u></em>
	$(document).foundation();
Foundation.reInit('equalizer');
});

Layout Code:

[wpv-layout-start]
[wpv-items-found]
<!-- wpv-loop-start -->
<div class="grid-container fluid">
<div class="wraplistings">
<div class="grid-x grid-margin-x grid-margin-y" data-equalizer="yachtpaneltext" data-equalize-by-row="true">
   <wpv-loop>
<div id="yachtpanel" class="small-12 medium-6 large-4 xlarge-3 xxlarge-3 cell">
     <a class="yachtthumbnaillink" href="[wpv-post-url]">[wpv-conditional if="( '[wpv-post-featured-image output="url"]' ne '' )"]<img src="[wpv-post-featured-image output="url"]" alt="[wpv-post-title]" class="yachtthumbnail">[/wpv-conditional][wpv-conditional if="( '[wpv-post-featured-image output="url"]' eq '' )"]<img src="[themeroot]img/classic-yacht-charters.gif" alt="[wpv-post-title]" class="yachtthumbnail">[/wpv-conditional]</a>
  <a href="[wpv-post-url]" title="[wpv-post-title]"><h4>[wpv-post-title]</h4></a>
<div class="yachtpaneltext" data-equalizer-watch="yachtpaneltext">
     <p><strong>Guests</strong>: [wpv-conditional if="( $(wpcf-total-guests-sleeping) gt '0' )"][types field="total-guests-sleeping" class="" style=""][/types][/wpv-conditional][wpv-conditional if="( $(wpcf-total-guests-sleeping) lt '1' )"]Contact us for Information[/wpv-conditional]<br />
 <strong>Built</strong>: [types field="year-built" class="" style=""][/types] (<em>[types field="builder" class="" style=""][/types]</em>)<br />
 <strong>Cruising Area</strong>: 
    [types field="primary-cruising-area" class="" style=""][/types]</p>
  <!--<p class="charterprices"><strong>Charter Cost</strong></p>-->
   <!--[types field='charter-prices'][/types]-->
    <div class="clearboth"></div>
</div><!--paddingfifteen-->
<a class="button expanded nomargin small" href="[wpv-post-url]" >Charter Cost & Full Details <span class="arrow">&#9658;</span></a>
</div><!--yachtpanel-->
   </wpv-loop>
</div><!-- grid-x -->
</div><!-- wraplistings -->
</div><!-- grid-container fluid -->
<!-- wpv-loop-end -->
[/wpv-items-found]
[wpv-no-posts-found][wpml-string context="wpv-views"]
<div class="grid-x grid-margin-x grid-padding-x grid-padding-y grid-margin-y">
<div class="small-12 medium-10 medium-offset-1 large-8 large-offset-2 cell">
  <p class="text-center"><strong>No yachts were found using the selected filters. Please click the Reset button or change a filter setting.</strong></p>
</div><!--small-12 cell-->
  </div><!--grid-x-->
[/wpml-string][/wpv-no-posts-found]
[wpv-layout-end]

[Nigel]

I was able to log in to the backend of your dev site and check the View, and I noticed one obvious problem that you might fix before going any further.

And in the Output Editor at the very bottom there are two required shortcodes, but you seem to have deleted one. Namely the wpv-filter-meta-html shortcode. Expand the formatting instructions of that section to see the details. Without that, your search filters are not added to the page.

I can't see the View on the front end, let me set up a private reply to get the password from you.

[BD]

Thanks Nigel,

The output editor at the bottom contained the following shortcodes:

[wpv-filter-meta-html]
[wpv-layout-meta-html]

I see that there is now a third one there - did you add this one?

[wpv-filter-meta-html]
[wpv-layout-meta-html]
[wpv-filter-meta-html]

The problem still remains though.

Access details in private reply

Many thanks for your help, Nick

[BD]

I can't seem to send this privately - please delete when noted, thanks

The front end password is: redacted
The view in question is: Classic Yacht Listings View

[Nigel]

That's mighty odd, it's missing when I access the site (screenshot).

Are we talking about different Views?

Did I forget to activate a private reply?

I need the password to see the page on the front-end, let me try again.

[Nigel]

Sorry, cross-posted. I've deleted that password.

[BD]

The view is: Classic Yacht Listings View

[Nigel]

When I scan that View it says it is not used anywhere yet, so I don't know where I should look on the front-end and expect to see it.

In the Search and Pagination section you have inserted pagination controls, but no filter controls (screenshot), which is different to the markup you shared in your initial question.

I'm not sure what I'm supposed to be looking at.

I first looked at Search Yachts Widget View which is the View on the page you shared, but now I'm looking at Classic Yacht Listings View.

[BD]

I'm very sorry Nigel - I pasted in the wrong view name - can't see the wood for the trees etc.

The correct one is: Classic Yacht Filter Search

It is rendered via PHP which appears on the front end here: hidden link

[Nigel]

I think the problem may be how you have added the price filter, whereby there is no empty option for the max price, so if I just search by guest capacity of, say, 20, then a search parameter is also added for the max price, like so:

hidden link

(I deleted some empty parameters so you can see more clearly the problem.)

That then generates a WP_Query with the meta_query you can see in the screenshot.

Try updating your filter controls so that they have an empty option for when nothing has been selected for the max price.

[BD]

Thanks very much for your help Nigel. It turns out that the sorting issue (price / guests - ascending / descending) was not working due to a post order plugin conflict. This has been resolved.

However, the problem with the price filter remains. I emptied the values for '€0' (for min) and 'Any' (for max). This resolved the problem with zero posts being returned when selecting any option, but the price comparison filter does not work. Having emptied the min / max values in the filter on hidden link the filter returns the incorrect numbers of posts - and it also allows the user to select a higher minimum price than a maximum price - but still returns results...

I have created a second DEV version of the website with older versions of Types (3.2.4) and Views (2.7.2). Here the price comparison filter works perfectly. All I need to do to break this is to update the Types and Views plugins to the latest versions:
hidden link
(same front end password as before)
The code for the price comparison filter at the above domain is as follows:

<!-- Working Price Filter for  <em><u>hidden link</u></em> using Types (3.2.4) and Views (2.7.2)-->
<div class="form-group small-6 large-2 cell">
	<label>[wpml-string context="wpv-views"]Min Charter Price p/w[/wpml-string]</label>
	[wpv-control-postmeta display_values="€0,€20%%COMMA%%000,€40%%COMMA%%000,€60%%COMMA%%000,€80%%COMMA%%000,€100%%COMMA%%000,€120%%COMMA%%000,€140%%COMMA%%000,€160%%COMMA%%000" values="0,20000,40000,60000,80000,100000,120000,140000,160000" field="wpcf-charter-price-guide" type="select" source="custom" url_param="wpv-wpcf-charter-price-guide_min"]
</div>
<div class="form-group small-6 large-2 cell">
	<label>[wpml-string context="wpv-views"]Max Charter Price p/w[/wpml-string]</label>
	[wpv-control-postmeta values="1000000,20000,40000,60000,80000,100000,120000,140000,160000,1000000" display_values="Any,€20%%COMMA%%000,€40%%COMMA%%000,€60%%COMMA%%000,€80%%COMMA%%000,€100%%COMMA%%000,€120%%COMMA%%000,€140%%COMMA%%000,€160%%COMMA%%000,Over €160%%COMMA%%000" field="wpcf-charter-price-guide" type="select" source="custom" url_param="wpv-wpcf-charter-price-guide_max"]
</div>

The code for the price comparison filter at the old dev domain is as follows:

<!-- Price Filter for  <em><u>hidden link</u></em> using latest versions of Types and Views-->
  <div class="form-group small-6 large-2 cell">
	<label>[wpml-string context="wpv-views"]Min Charter Price p/w[/wpml-string]</label>
	[wpv-control-postmeta display_values="€0,€20%%COMMA%%000,€40%%COMMA%%000,€60%%COMMA%%000,€80%%COMMA%%000,€100%%COMMA%%000,€120%%COMMA%%000,€140%%COMMA%%000,€160%%COMMA%%000" values=",20000,40000,60000,80000,100000,120000,140000,160000" field="wpcf-charter-price-guide" type="select" source="custom" url_param="wpv-wpcf-charter-price-guide_min"]
</div>
<div class="form-group small-6 large-2 cell">
	<label>[wpml-string context="wpv-views"]Max Charter Price p/w[/wpml-string]</label>
	[wpv-control-postmeta display_values="Any,€20%%COMMA%%000,€40%%COMMA%%000,€60%%COMMA%%000,€80%%COMMA%%000,€100%%COMMA%%000,€120%%COMMA%%000,€140%%COMMA%%000,€160%%COMMA%%000,Over €160%%COMMA%%000" values=",20000,40000,60000,80000,100000,120000,140000,160000,1000000" field="wpcf-charter-price-guide" type="select" source="custom" url_param="wpv-wpcf-charter-price-guide_max"]
</div>
  <!-- Price Filter -->

For example, if you go to hidden link and select min price: €20,000 and max price of €40,000, 54 results are returned:
hidden link

If you select the same values on the site with older Types/Views hidden link and select identical values, 38 results are returned:
hidden link

==

Sorry that this is a little rambling - the bottom line is that I would like the price comparison filter on hidden link to compare min and max prices and return the correct number of yachts, like it did before. If you could let me know exactly how to tweak the code for the filter to achieve this, I would be most grateful.

Thanks again, Regards Nick

[Waqar]

Hi,

Thanks for writing back.

Nigel is on holiday until January 1st and I'll be following up on this ticket.

I can see the issue with the min and max price ranges filters in the view "Classic Yacht Filter Search".

I'll need to perform some tests on my website with similar filters to confirm this and will share my findings, as soon as this testing completes.

regards,
Waqar

[Waqar]

Thank you for waiting.

During testing on my own website, I was able to reproduce this issue with the min and max range filtering.

This has been passed on to the concerned team for further review and I'll keep you updated with the progress through this ticket.

For now, there are two workarounds:

1. You can downgrade Views plugin to version 2.9.4

OR

2. You can use the filter "wpv_filter_query" to update the query manually.
( ref: https://toolset.com/documentation/programmer-reference/views-filters/#wpv_filter_query )

Example:

add_filter( 'wpv_filter_query', 'filter_min_max_search', 1000 , 3 );
function filter_min_max_search( $view_args, $view_settings, $view_id ) {

	if ( ( !is_admin() && isset($view_settings['view_id'] ) ) && ( ($view_settings['view_id'] == 1234) ) )
	{
		if ( (isset($view_args['meta_query'])) && (!empty($view_args['meta_query'])) ) {

			$target_field = "wpcf-book-price";

			$url_param_min = "wpv-wpcf-book-price_min";
			$url_param_max = "wpv-wpcf-book-price_max";

			foreach ($view_args['meta_query'] as $key => $value) {
				if(is_array($value)) {
					if ($value['key'] == $target_field) {
						$required_index = $key;
					}
				}
			}

			if ( isset($required_index) ) {
				$min_value = $_GET[$url_param_min];
				$max_value = $_GET[$url_param_max];
				$view_args['meta_query'][$required_index] = array('key' => $target_field, 'value' => array($min_value, $max_value), 'type' => 'NUMERIC', 'compare' => 'BETWEEN' );
			}		
		}	
	}

	return $view_args;
}

Important notes:

a). Please replace "1234" with an actual view's ID and "wpcf-book-price", "wpv-wpcf-book-price_min" and "wpv-wpcf-book-price_max", with the actual field and URL parameter slugs used in the view.

b). The above code snippet can be included through either Toolset's custom code feature ( ref: https://toolset.com/documentation/adding-custom-code/using-toolset-to-add-custom-code/ ) or through active theme's "functions.php" file.

c). For this snippet to work, it is important that the view is set to "Full page refresh when visitors click on the search button", in the "Custom Search Settings".

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

regards,
Waqar

[BD]

Hi Waqar,

Thanks very much for your help with this. Unfortunately I have a couple of other client sites with similar filters and the Ajax Refresh functionality is something of a deal breaker - they will not be happy to downgrade to a filter requiring a button click to refresh.

This leaves me the option of downgrading the Views plugin which I have had to do and the filter is working again (on an alternative DEV site). Will this problem be resolved in a future release of Views? If not, I'll be stuck on the older version indefinitely.

Thanks again for your assistance, Regards Nick

[Waqar]

Hi Nick,

Thank you for waiting and I've received an update from the developers on this.

A fix has been proposed for this issue in the next release and for now, you can use the patch file, from this link:
hidden link

Please replace the file "wpv-filter-meta-field-embedded.php" from the zip file, in place of the file of the same name at:
wp-content/plugins/wp-views/embedded/inc/filters/
( in Views version 3.0.1 )

I hope this helps and let me know how it goes.

regards,
Waqar