EloquentStudio / filter.js

Complete solution for client side filtering and rendering using JSON data
http://eloquentstudio.github.io/filter.js
MIT License
665 stars 183 forks source link

Initiate search #180

Closed krivaces closed 4 years ago

krivaces commented 4 years ago

I want to be able to populate the search box using a querystring value in the url. I was able to do that but how do I get it to search at that point. I can't find the event that triggers the search. If I load the html page like MySearch.html?Product=cars cars gets placed in the search box but nothing happens. If I click in the search box and add a space, the search fires off.

Scott

jiren commented 4 years ago

Set filter_on_init option to true

https://github.com/jiren/filter.js/blob/bfce8c2c23541fcfbefa87470227d02d14c0ff85/examples/index.js#L20

OR call filter function using Filter.js object after page load. i.e

fjs.filter()
krivaces commented 4 years ago

Thank you. The second option worked out for me. On my HTML search page, I added this: $(document).ready(function() { var searchItem = getUrlParameter('search') $('#searchbox').val(searchItem); FJS.filter() }); function getUrlParameter(name) { name = name.replace(/[[]/, '\[').replace(/[]]/, '\]'); var regex = new RegExp('[\?&]' + name + '=([^&#]*)'); var results = regex.exec(location.search); return results === null ? '' : decodeURIComponent(results[1].replace(/+/g, ' ')); }; so the url becomes MySearchPage.html?search=whatever The search page is on a server and we wanted to pre-filter the page based on other criteria the user may click on. Thanks for the quick response. Scott