I have a function listening to select elements.
function initEventListeners () {
// Listening to category select
$categorySelect.on("change", function () {
helper.createFilteredSamples();
});
// Listening to platform select
$platformSelect.on("change", function () {
helper.createFilteredSamples();
});
// Listening to language select
$langugeSelect.on("change", function () {
helper.createFilteredSamples();
});
}
And helper method to return matched samples
var helper = {
// create filtered samples based on the search and dropdown values
createFilteredSamples: function () {
var categoryValue = $categorySelect.val();
var languageValue = $langugeSelect.val();
var platformValue = $platformSelect.val();
if (categoryValue === "default" && languageValue === "default" && platformValue === "default") {
helper.createTableUi(samples);
return;
}
var sampleSet = samples.filter(function (sample) {
var cats = sample.Category.split(" ");
var langs = sample.Language.split(" ");
var plats = sample.Platform.split(" ");
return ($.inArray(categoryValue, cats) !== -1 && $.inArray(languageValue, langs) !== -1 && $.inArray(platformValue, plats) !== -1);
});
helper.createTableUi(sampleSet);
}
};
The problem is this line return ($.inArray(categoryValue, cats) !== -1 && $.inArray(languageValue, langs) !== -1 && $.inArray(platformValue, plats) !== -1);
. This only works when users selected all three dropdowns. How do I get the matched result in any combination that users picked?