const minEl = document.getElementById("min");
const maxEl = document.getElementById("max");
const searchEl = document.getElementById("search");
const desiredGenderEl = document.getElementById("desired-gender");
const yourGenderEl = document.getElementById("your-gender");
const styleEl = document.getElementById("style");
DataTable.ext.search.push(function(settings, data, dataIndex) {
let min = parseInt(minEl.value, 10);
let max = parseInt(maxEl.value, 10);
let age = parseFloat(data[1]) || 0;
const ageIsInRange = (isNaN(min) && isNaN(max))
|| (isNaN(min) && age <= max)
|| (min <= age && isNaN(max))
|| (min <= age && age <= max);
let search = searchEl.value;
const searchIsValid = search?.length === 0 || data.some(d => d.toLowerCase().includes(search.toLowerCase()));
const desiredGenderValue = desiredGenderEl.value;
const desiredGenderValid = desiredGenderValue === "" || desiredGenderValue === data[2];
const yourGenderValid.value;
const yourGenderValid = data[3].includes(yourGenderEl.value);
const styleValid.value;
const styleValid = data[4].includes(styleEl.value);
return ageIsInRange && searchIsValid && desiredGenderValid && yourGenderValid && styleValid;
});
const table = new DataTable("#docs", {
order: [[9, "desc"]],
searching: true,
});
minEl.addEventListener("input", () => table.draw());
maxEl.addEventListener("input", () => table.draw());
searchEl.addEventListener("input", () => table.draw());
desiredGenderEl.addEventListener("change", () => table.draw());
yourGenderEl.addEventListener("change", () => table.draw());
docs_length.remove();
docs_filter.remove();