I am struggling a little with a code for multiple (3 dropdowns). I followed WIx Wiz tutorial on Youtube and managed to make it work for the first 2 dropdowns. I am stuck on the third one.
It is for a job website.
I want to filter the jobs by:
1. Country
2. City
3. Job Sector
In that order.
My drop downs are:
1. CountryFilterDropdown – works with “CountryListDataset”
2. CityFilterDropdown – works with “CityListDataset”
3. JobSectorFilterDropdown – works with “JobSectorListDataset”
My collection is called Jobs – works with “JobsDataset”
Here is my code following your tutorial:
import wixData from 'wix-data';
$w.onReady(function () {
$w('#CountryFilterDropdown').onChange((event) => {
$w('#JobsDataset').onReady(() => {
const country = event.target.value; //$w('#CountryFilterDropdown').value
$w('#JobsDataset').setFilter(
wixData.filter().eq("country", country)
)
$w('#CityListDataset').setFilter(
wixData.filter().eq("country", country)
)
});
});
$w('#CityFilterDropdown').onChange((event) => {
$w('#JobsDataset').onReady(() => {
const city = event.target.value;
$w('#JobsDataset').setFilter(
wixData.filter().eq("city", city)
)
});
});
$w('#JobSectorFilterDropdown').onChange((event) => {
$w('#JobsDataset').onReady(() => {
const jobSector = event.target.value;
$w('#JobsDataset').setFilter(
wixData.filter().eq("jobSector", jobSector)
)
});
});
});
How I understand this is that, in the first part (CountryFilterDropdown) there is a code to filter the second the second dropdown (CityFilterDropdown) to only show cities from the specific country within the collection. That works fine.
When I move on to the second dropdown (CityFilterDropdown), it works great. Only shows cities from the country chosen in the first drop down and filter the jobs accordingly.
It is the third dropdown (JobSectorFilterDropdown) that I have an issue with. When I select Job sector, it displays all the jobs within that sector from all the countries disregarding the first two filters (Country and city).
Kindly me with the third filter code so that it only displays jobs within the job sector chosen in dropdown 3 (job sector) from the country and city chosen from dropdowns 1 (Country) and 2 (City) respectively.
Thank you advance.