trainingRadioBtns.forEach(onHandleCheckbox);
// Update selectedOptions[] when checkboxes are clicked
function onHandleCheckbox(checkbox) {
checkbox.addEventListener("change", () => {
const status = [...trainingRadioBtns].map((btn) => ({
value: btn.value,
checked: btn.checked,
}));
checkedValues = status.filter((btn) => btn.checked).map((btn) => btn.value); // selected check values array
const notSelected = status.filter((btn) => !btn.checked).map((btn) => btn.value); // not selected check values array
console.log("selected", checkedValues);
console.log("not selected", notSelected);
filteredItems = locations.filter((item) => {
// Prepare each individual match condition for filtering
// const matchesCategory = checkedValues.includes(item.category);
const matchesFunded = (checkedValues.includes("funded") && item.funded) || notSelected.includes("funded");
const matchesOnline = (checkedValues.includes("isAvailableOnline") && item.isAvailableOnline) || notSelected.includes("isAvailableOnline");
const matchesPartTime = (checkedValues.includes("isAvailablePartTime") && item.isAvailablePartTime) || notSelected.includes("isAvailablePartTime");
const matchesApprentice = (checkedValues.includes("apprenticeshipTraineeship") && item.apprenticeshipTraineeship) || notSelected.includes("apprenticeshipTraineeship");
const matchesVetFeeCourse = (checkedValues.includes("isVetFeeCourse") && item.isVetFeeCourse) || notSelected.includes("isVetFeeCourse");
// Check if the item matches any of the selected filters (OR logic) and return
return matchesFunded && matchesOnline & matchesPartTime & matchesApprentice & matchesVetFeeCourse;
});
// if no items are found on filtering, show a message in the DOM
if (filteredItems.length === 0) {
list.innerHTML = `<h4>No items exist with these current filters<h3>`;
} else {
displayLocations();
}
});
}