Make an Autocomplete Input in Wix with the JavaScript SDK Data Query
#wixstudio #velobywix #autocomplete #cms #javascript
🎥 What’s in This Video
In this video, I’ll walk you through building an autocomplete input in Wix that pulls suggestions from a CMS collection. Whether you’re developing dynamic search fields or just curious about connecting inputs to backend data, this video will help you create a smart, responsive autocomplete with JavaScript and the Wix SDK.
🎓*New to Developing on Wix?*
Try my Velo for Beginners course now on Udemy! https://www.udemy.com/course/velo-for...
⏱️*Timestamps*
00:00 – Intro to autocomplete concept
00:56 – Setting up CMS and input field
01:56 – Enabling dev mode and writing query
03:51 – Using SDK to search CMS
04:56 – Displaying autocomplete results
11:46 – Enter key functionality
21:18 – Highlighting matched substrings
26:13 – Making search case insensitive
28:04 – Handling multi-word searches
34:31 – Final UX test and fixes
37:49 – Summary and next steps
🧰 Resources Mentioned
🔗 Wix JavaScript SDK – Query API docs – https://www.wix.com/velo/reference/wi...
🔗 Highlight Substring Function – Bold matched terms – Covered in video
📚 Related Videos
▶️ Using Wix Data to Power a Search Bar – • Video
▶️ Searchable Dropdown in Wix with Velo – • Video
▶️ Velo CMS Filtering Basics – • Video
💬 Let’s Chat
Have questions or want to share your thoughts? Drop a comment below – I read them all!
Want to talk one-on-one? https://www.thewixwiz.com/book-online
👍 Support the Channel
Like & subscribe if this helped you out – it really helps the channel grow! 🙌🔔 Don’t forget to hit the bell so you never miss a video.
Show extra ❤️ by becoming a member:
/ @thewixwiz
🔗 Stay Connected
Twitter: / @thewixwiz
Instagram: / @thewixwiz
Facebook: / thewixwiz
Website: https://thewixwiz.com/contact-us
Email: [email protected]