1.1 KiB
1.1 KiB
title | tags | category | ||
---|---|---|---|---|
Filtering |
|
programming |
I was watching the video How To Create A Search Bar In JavaScript by Web Dev Simplified to learn how to do a search bar in JavaScript.
What I realised as I was coding along, was that the video was reallymore about filtering data than what I might think of as a search bar. Which is fine, and totally not wrong, but I do find some of Kyle's choices suspect / curious.
For instance he uses data attributes for selecting elements from the html, and runs toLowerCase()
on strings every single time you type a character. The latter to my mind seems incredibly wasteful.
searchInput.addEventListener("input", (event) => {
const value = event.target.value.toLowerCase();
users.forEach((user) => {
const isVisible =
user.name.toLowerCase().includes(value) ||
user.email.toLowerCase().includes(value);
user.element.classList.toggle("hide", !isVisible);
});
});