Forums › Forums › Search & Filter Pro › Dynamic slider range
- This topic has 5 replies, 3 voices, and was last updated 8 years, 5 months ago by Ross.
-
Ross Moderator(Private) May 19, 2016 at 1:05 am #45974
Hi Arek
Sure you can access the slider plugin we use, and modify the values… Here is some sample code:
var slider_object = $('.searchandfilter .sf-field-post-meta-_price').find(".meta-slider")[0]; slider_object.noUiSlider.set(['22', null]); //if you want to update the min value slider_object.noUiSlider.set([null, '100']); //if you want to update the max value slider_object.noUiSlider.set(['123', '625']); //if you want to update both values
For each field in S&F, there is usually a parent
li
, which will have a class attached specifically to target that field (and the slider).For a post meta key of
_price
, the class I used was.sf-field-post-meta-_price
– so take a look at the markup of hte search form for your field.Then this should be fairly self explanatory –
var slider_object = $('.searchandfilter .sf-field-post-meta-_price').find(".meta-slider")[0];
The first line finds the meta slider itself and puts it into a variable.The next lines simply set the values.
Hope that helps
Ross Moderator(Private) May 25, 2016 at 4:15 pm #46666Hey Arek
I’ve just done a quick update to the plugin which should allow you to change the slider min / max settings (not their actual values).
Install the update I’ve just emailed to you, by following:
1) disable S&F (do not delete via wp-admin)
2) via FTP upload and replace the existing S&F in –wp-content/plugins/search-filter-pro/
3) enable S&F via wp-adminAfter this you can use the following filter to change the min max:
function change_slider_min_max($input_object, $sfid) { if(($input_object['name']=='_sfm__price')&&(($input_object['type']=='range-slider')||($input_object['type']=='range-number'))) { $input_object['attributes']['data-min'] = 10; $input_object['attributes']['data-max'] = 200; } return $input_object; } add_filter('sf_input_object_pre', 'change_slider_min_max', 10, 2);
Check here for a full example of how to use the filter:
https://gist.github.com/rmorse/7b59b45a14b1ca179868
Thanks
-
AuthorPosts