Filter dynamic page content through 2 dropdowns

Ask the community
,
11

Hey Daniel :raised_hand_with_fingers_splayed:

Glad that it was helpful …
By the way, do you know that there’s already a method to return the unique items called distinct() . It will save you time and make the page faster.

Use it on your existing query like this:

await wixData.query("Sezona").contains("tym", $w("#dropdownTeam").value)
        .limit(100)
        // This will return unique items of the below field
        .distinct("sezona")        
        .then((result) => {
                $w("#dropdownSeason").options = result.items;
                // Which are already unique. 😉                
        })

Don’t place the redirection command inside the onReady() function, you don’t want them to be redirected immediately once the page is ready, you need to create an onChange() event handler that will redirect the visitors only if a value is selected, and disable the seasons dropdown while no team is selected.

First of all, set the seasons dropdown to be disabled on load by un-checking the mark in the dropdown properties panel that says “Enabled on load”, then add the event handlers.

$w('#dropdownTeams').onChange((event) => {
    if (!$w('#dropdownSeason').enabled) {
        $w('#dropdownSeason').enable();
    }
})

$w('#dropdownSeason').onChange((event) => {
    let team = $w('#dropdownTeams').value;
    let season = $w('#dropdownSeason').value;
    
    $w('#dropdownSeason').disable().then(() => {
        wixLocation.to(`/soupiska/${team}/${season}`);
    })
})

This way, they won’t be redirected unless they choose a season.

Hope this helps~!
Ahmad