Dynamic search bar to be filtered typed alphabet

I am currently working on implementing a filter for my dynamic search bar to display only the items that starts with the letter I have typed in the search bar in Wix Website.

I have used a tutorial from this youtube video to create a dynamic search bar for my website: https://www.youtube.com/watch?v=1lFnNWKeUxY&t=825s

Here are the code: https://www.vitzael.com/_files/ugd/44be10_3ff127cbdaf44aeda51bdd44a030641b.pdf

The code is functioning very well, but it currently displays all data items that contain the letter I typed. For instance, if I entered ‘A’, it will display ‘Barbie’ as well, whereas I only want it to display data that starts with the letter ‘A’.

Can someone help me with this? Thank you!

That is because they created a generic search function to display a list of results.

They made it “look” like it was an “auto-complete” function, but it is just a search that displays results on keypress.

There are many other YouTube tutorials that show you how to create an “auto complete” function, but I don’t want to send you on a hunt!

You can modify the existing code so that instead of using .contains you can use .startsWith

This will essentially make your search bar into an autocomplete suggestion search bar instead.

#codequeen

1 Like

Hi, thank you so much for the help! It works well, sorry for the late reply :slight_smile:

1 Like