Hideseek on collection list

Design help Custom code
1

Hi,

By advance sorry for my bad english, i’m french.
Here is my problem :
I made this page : here
Webflow project : here
I know, design not responsive but let’s concentrate on the searchbar :smiley:
I want to use the jquery plugin Hideseek for this searchbar on my collection list “Mes adresses”.
So i call plugin in my header like this :
<script src="https://cdnjs.cloudflare.com/ajax/libs/hideseek/0.8.0/jquery.hideseek.min.js"></script>

‍And in my footer, this code :
<script> $(document).ready(function() { $('#search').hideseek({ list: '#adresses', nodata: 'Rien ne correspond à votre recherche', highlight: true, }); }) </script>

But surprise, it doesn’t work.
I’m expecting this kind of result : here

I think this is because it’s not on simple HTML elements, but dynamic content with my collection list.

Didn’t find any topic on that specific case.

Thanks for help,

2

Hi @admin_Sesame

the issue is that you need to id the div that has the information you would like to search… so you will need to change the search bar html embed to read as follows:

<input type="text"
data-list=".mes-adresses" 
class="search w-input" 
maxlength="256" 
name="name" 
data-name="Name" id="search"
placeholder="Nom, lieu, restaurant, commerce, domaine..." 
style="width:100%; 
border:none; 
outline:none; 
background-color:transparent;"/>

after that publish and it should all work

3

hey @admin_Sesame and @IVG. I’m having similar issues and want to achieve the exact same result for my search bar and filter buttons but am very new to custom code on webflow.

I made this page: Here
And the webflow project is here.

The Hideseek plugin is only partly working in that it highlights text but does not make irelvent resources disappear. And I’m not sure how to get the filter buttons (topics which is a multi-reference and program which is a single reference) to work. I’ve tried to use the Mixitup plugin but to no success How to add dynamic filtering and sorting to your Webflow websites | Webflow Blog

Any help would be very very much appreciated :slight_smile:

4

Hi @JustLewis,
Sorry i didn’t refresh this post but i finally got a nice result by following this tuto.

Sorry @IVG, didn’t try your solution, but thanks aswell.

Have a nice day

5

Thanks @admin_Sesame for the tutorial link. For some reason even following the tutorial closely I couldn’t get it to work…http://tiny.cc/whtzlz