[Resolved] WooCommerce Filtering with price range between not filtering properly

[Author]

Posts

[Nashaat]

I am trying to filter WooCommerce products by price range filter between.
The Filter is like following:

<div class="row">
  
  <div class="col">

    <div class="form-group"><label>min price</label>
    [wpv-control-postmeta field="views_woo_price" type="select" source="custom" url_param="wpv-views_woo_price_min" values=",10000,50000,100000,150000,200000,250000,300000,350000,400000,450000,500000,999000" display_values="all,$10.000,$50.000,$100.000,$150.000,$200.000,$250.000,$300.000,$350.000,$400.000,$450.000,$500.000,$1.000.000" class="dropdown-box"]
    </div>

  </div>
  
  <div class="col">

    <div class="form-group"><label>max</label>
    [wpv-control-postmeta field="views_woo_price" type="select" source="custom" url_param="wpv-views_woo_price_max" values=",10000,50000,100000,150000,200000,250000,300000,350000,400000,450000,500000,999000" display_values="all,$10.000,$50.000,$100.000,$150.000,$200.000,$250.000,$300.000,$350.000,$400.000,$450.000,$500.000,$1.000.000" class="dropdown-box"]
    </div>

  </div>
  
</div>

The issue is following:

1- i chose a minimum price lets say the highest in the minimum is $250.000
2- views Results updated.
3- when i try to chose max price i can chose a price that is lower than $250.00 which results no items found.

- i expect after choosing a minimum price lets say $250.000 the max available price should begin from $300.000 and not $100.000 (see image)

Weird behaviour i am not sure if it my Views Settings or i am missing something but here you can test this. i have translated the filter to english. hidden link

[Minesh]

Hello. Thank you for contacting the Toolset support.

Well - could you please share problem URL and access details so I can debug the query generated by views and guide you in the right direction that will eventually help you to resolve your issue.

*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin and FTP) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.

I would additionally need your permission to de- and re-activate Plugins and the Theme, and to change configurations on the site. This is also a reason the backup is really important. If you agree to this, please use the form fields I have enabled below to provide temporary access details (wp-admin and FTP).

I have set the next reply to private which means only you and I have access to it.

[Minesh]

Ok - thank you for all the details. I checked your views configuration and the thing is that there is no way to update the filter values based on another filter selection. There is no such feature available.

This can be achieved by adding some custom jQuery/javascript code where you should define the limit and based on that limit value remove the options from your max price select dropdown.

To achieve your goal I've added the following JS code to your view's filter section's JS box:

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
	*/
  
   
  jQuery('select[name="wpv-views_woo_price_min"] option:selected').each(function() { 
      var x = jQuery(this).val();
      jQuery('select[name="wpv-views_woo_price_max"] option').filter(function(){
             return parseInt(this.value) <= x;
      }).remove();
   });
  
	
});

I can see now the max select options are filtered out when you select the option from min select box.

[Nashaat]

Thanks Minesh. This works now!

I am just wondering why there is no way of filtering values based on another value? what is the importance of between price filter and ajax filter if this not working properly ?

can we please add this as a high feature request.

[Nashaat]

one more question. I would like to add your jQuery/Javascript code to Layouts CSS and JS.

what is the best way to add it to Layout JS instead in the view javascript editor and let it run on this specific View only?

[Minesh]

I am just wondering why there is no way of filtering values based on another value? what is the importance of between price filter and ajax filter if this not working properly ?
=> Well - there is no feature available so that you can build dependent dropdown and update the values.

what is the best way to add it to Layout JS instead in the view javascript editor and let it run on this specific View only?
=> You should not add it to Layouts CSS and JS editor as the code we added specifically belongs to the view to which its added.

Please feel free to resolve this ticket and open a new ticket to raise the feature request and set its type to "Request" when opening the ticket. Thank you. Glad to help.

[Nashaat]

Thanks for your feedback Minesh. I use 4 Views that need this jQuery so you think its better to add this to each of them? and not to make it gloabl? or can i add it to Javascript layout but only with specific Views IDs? how this will be

[Minesh]

Yes - as this code belongs to view - please add it to each of the view that would be better I would say and easy to debug later on when you may have any issues.

[Nashaat]

Great! Thank you Minesh!

[Nashaat]

Forgot to Resolve the Ticket!