how to match both the filter value to lower case

here how can i get the classList to lowerCase
function filterResults() {
const filter1Value = filter1.value;
const filter2Value = filter2.value;
// Get values of additional filters as needed
filteredList.forEach((el) => {
if (
el.classList.contains(`${filter1Value.toLowerCase()}`) &&
el.classList.contains(`${filter2Value.toLowerCase()}`)
) {
el.style.display = "block";
} else {
el.style.display = "none";
}
});
}
function filterResults() {
const filter1Value = filter1.value;
const filter2Value = filter2.value;
// Get values of additional filters as needed
filteredList.forEach((el) => {
if (
el.classList.contains(`${filter1Value.toLowerCase()}`) &&
el.classList.contains(`${filter2Value.toLowerCase()}`)
) {
el.style.display = "block";
} else {
el.style.display = "none";
}
});
}
2 Replies
MarkBoots
MarkBoots9mo ago
get the classNames of the element in an array, map them to a lowercase value and then do the if statement
filteredList.forEach(el => {
const classNames = [...el.classList].map(className => className.toLowerCase());
if(
classNames.includes(filter1Value.toLowerCase()) &&
classNames.includes(filter2Value.toLowerCase())
){
...
} else {
...
}
})
filteredList.forEach(el => {
const classNames = [...el.classList].map(className => className.toLowerCase());
if(
classNames.includes(filter1Value.toLowerCase()) &&
classNames.includes(filter2Value.toLowerCase())
){
...
} else {
...
}
})
or, just make sure your classnames are already lowercased you can be a bit more fancy and make your own prototype method el.classList.containsAll() so you can reuse it easier
DOMTokenList.prototype.containsAll = function(classNames) {
if (!Array.isArray(classNames)) classNames = [classNames]
const classList = [...this].map(name => name.toLowerCase())
return classNames.every(className => classList.includes(className.toLowerCase()));
};

filteredList.forEach(el => {
if(el.classList.containsAll(filter1Value, filter2Value)){
...
} else {
...
}
})
DOMTokenList.prototype.containsAll = function(classNames) {
if (!Array.isArray(classNames)) classNames = [classNames]
const classList = [...this].map(name => name.toLowerCase())
return classNames.every(className => classList.includes(className.toLowerCase()));
};

filteredList.forEach(el => {
if(el.classList.containsAll(filter1Value, filter2Value)){
...
} else {
...
}
})
Aldrin
Aldrin9mo ago
ok thanks 👍
Want results from more Discord servers?
Add your server