Page 1 of 1
LISE - search items with range slider
Posted: Thu Mar 14, 2019 2:54 pm
by przemo
Has anyone idea and solution to replace the standard multiselect field with a modern range bar in LISE search template like attached?
I want to use this plugin:
http://ionden.com/a/plugins/ion.rangeSlider/index.html
For now i have this
Code: Select all
<input type="text" class="js-range-slider" name="{$actionid}search_{$fielddef->alias}[]" id="filter_{$fielddef->alias}[]" value="" />
Looks great - but not working...
Can anyone help with that?
Re: LISE - search items with range slider
Posted: Thu Mar 14, 2019 3:11 pm
by deepvyas
Hi ,
Surely I can help you, but would like to know were you want to implement the same.
Thanks
Re: LISE - search items with range slider
Posted: Thu Mar 14, 2019 3:39 pm
by DIGI3
Because LISE isn't using min/max for filtering, just a list of matches, it won't be straight forward to pass the min/max parameters to the filter function.
A method I used on one project was to pass those min/max values to my results template, and only include items that were within those parameters. It's not the most efficient if there's thousands of items, but on this project it worked really well.
I used Foundation's slider, but the theory is the same. The search form uses:
Code: Select all
<div class="slider" data-slider data-start="{$min}" data-initial-start="{$smarty.post.size_min|default:$min}" data-initial-end="{$smarty.post.size_max|default:$max}" data-end="{$max}" data-step="100">
And the results page uses:
Code: Select all
{if ($item->fielddefs.size.value >= $smarty.post.size_min|default:'0' && $item->fielddefs.size.value <= $smarty.post.size_max|default:'999999') || $item->fielddefs.size.value==''}
You can see it in action at
https://www.zri.nl/projecten, click on "Filteren"
Re: LISE - search items with range slider
Posted: Thu Mar 14, 2019 8:17 pm
by przemo
DIGI3 - I've implemented your solution and everything works ok for now.
BTW, I also changed the script for Foundation's slider.
Thank you very much
I hope this topic will help others too!