Update dropdown options based on other dropdown selection and free text search

Ask the community
,
1

Hello,
I currently have 3 dropdown menus and one free text search filter. When I select an option from one of the dropdown menus, the other dropdown options do not update according to the selection.
The same is happening when I use the free text search and try to narrow down the search using the dropdown.
This is the code that I’m using for the filters.

import wixLocation from 'wix-location';
import wixData from "wix-data";

$w.onReady(function () {
    $w("#table1").onRowSelect((event) => {
 let rowData = event.rowData;
 let str = rowData.funderName;
        str = str.replace(/\s+/g, '-').toLowerCase();
        wixLocation.to("/companies/" + str);
    });

    loadIndustry();
    loadAffiliation();
    loadStrategy();
});

let lastFilterCompany;
let lastFilterIndustry;
let lastFilterAffiliation;
let lastFilterStrategy;
let debounceTimer;

export function iCompany_keyPress(event) {
 if (debounceTimer) {
        clearTimeout(debounceTimer);
        debounceTimer = undefined;
    }
    debounceTimer = setTimeout(() => {
        filter($w('#iCompany').value, lastFilterIndustry, lastFilterAffiliation, lastFilterStrategy);
    }, 500);
}

function filter(company, industry, affiliation, strategy) {
 if (lastFilterCompany !== company || lastFilterIndustry !== industry || lastFilterAffiliation !== affiliation || lastFilterStrategy !== strategy) {
 let newFilter = wixData.filter();
 if (company)
            newFilter = newFilter.contains('funderName', company);
 if (industry)
            newFilter = newFilter.contains('industry', industry);
 if (affiliation)
            newFilter = newFilter.contains('affiliations', affiliation);
 if (strategy)
            newFilter = newFilter.contains('strategies', strategy);

        $w('#dataset1').setFilter(newFilter);
        lastFilterCompany = company;
        lastFilterIndustry = industry;
        lastFilterAffiliation = affiliation;
        lastFilterStrategy = strategy;
    }

}

function buildOptions(items) {
 return items.map(curr => {
 return { label: curr, value: curr };
    })
}

function loadIndustry() {
    wixData.query('Companies')
        .ascending("industry")
        .distinct("industry")
        .then(res => {
 let options = buildOptions(res.items);
            options.unshift({ "value": '', "label": 'All Industries' });
            $w('#iIndustry').options = options;
        });
}

function loadAffiliation() {
    wixData.query('Companies')
        .ascending("affiliations")
        .distinct("affiliations")
        .then(res => {
 let options = buildOptions(res.items);
            options.unshift({ "value": '', "label": 'All Affiliations' });
            $w('#iAffiliation').options = options;
        });
}

function loadStrategy() {
    wixData.query('Companies')
        .ascending("strategies")
        .distinct("strategies")
        .then(res => {
 let options = buildOptions(res.items);
            options.unshift({ "value": '', "label": 'All Strategies' });
            $w('#iStrategy').options = options;
        });
}

export function iIndustry_change(event) {
    filter(lastFilterCompany, $w('#iIndustry').value, lastFilterAffiliation, lastFilterStrategy);
}

export function iAffiliation_change(event) {
    filter(lastFilterCompany, lastFilterIndustry, $w('#iAffiliation').value, lastFilterStrategy);
}

export function iStrategy_change(event) {
    filter(lastFilterCompany, lastFilterIndustry, lastFilterAffiliation, $w('#iStrategy').value);
}

Any suggestions on this will be helpful. Thank you.