Have Dropdown values sort by boolean values in data set

Hi all,

I have an issue coding my dropdown menu. I am working on a dynamic client page and have a dropdown menu where the values are the industries my clients are in (EX: Medical). In my data set, I have columns of the industry names with Boolean values; if they are in that industry it is checked off.

On the client page, I want to logos of the clients in that industry to display when the matching dropdown value is selected. At the moment, I have all the logos displayed on the general page but am unable to get them to change when I used the dropdown menu.

What would be the proper code to get this to work? I’ve tried to combine a few things I found online that were associated but none of them have worked.

What code have you already tried ?

Hi! This is the code I’m currently trying to run:

import wixData from 'wix-data'
$w.onReady(function() {
});
export function categoryDropdown_change(event){
let filterCategory = $w('#clientsector').value;
if(filterCategory === "Medical"){
    $w('#dataset1').setFilter(wixData.filter().eq('Music', true));

I’ve also tried this which I found on YouTube. I only know how to make the ascending feature work, not for a boolean item.

import wixData from 'wix-data' 
$w.onReady(function () { 
    $w('#clientsector').onChange((event) => { 
        const sort = $w('#clientsector').value; 
        switch (sort) { 
            case "Medical": 
                $w('#dataset1').onReady(()=>{ 
                    $w('#dataset1').setSort( 
                        wixData.sort().ascending('Medical'))

Not sure if any of these are correct for what I’m trying to do. Any help is appreciated. Thanks!

Hey there,

I checked the code you have and adjusted it but I think you might have some syntax issues with the code as most of it is missing.
I made a video but I do think you could simplify it by just matching it the relevant field you want to filter by.

Additionally, here’s the code I used in the video to filter based on the dropdown. Let me know if there is any particular reason you need the booleans to check across the industry as I think just having a text field for the sector is enough to help filter the content.

import wixData from 'wix-data';

$w("#dropdown1").onChange((event) => { //change #dropdown1 to your dropdown ID
    let selectedValue = event.target.value; // Get the selected value from the dropdown
    console.log(selectedValue); // Log the selected value for debugging

    // Apply a filter to the dataset based on the selected value
    $w("#colorDataset").setFilter(//change #colorDataset to the name of your dataset
        wixData.filter().eq("colorName", selectedValue) // Filter where colorName matches the selected value
    )
    .then(() => {
        console.log("Dataset filtered successfully");
    })
    .catch((err) => {
        console.error("Error filtering dataset:", err);
    });
});

Hi Rob, thanks for sharing this! I will try the code.

The reason I am using booleans is because some clients fall into multiple industries. Let’s say one is a medical school, it’s industry would be ‘Medical’ and ‘Education’. I found that with using the regular filter you’d have to sort by the entire text in the field rather than a string, so there would be a dropdown value for each client since it would be filled in as 'Medical, Education".

I used boolean for each industry sector because I found that would be the cleanest way to have one client be categorized into all their sectors and, I hoped, I could sort by each individual sector. Not sure if that changes how I should use the code you provided above.

1 Like

In that case, I think Selection Tags would work well for your use case if the items fall into multiple categories. The article does a good job but to continue from what I shared above:

And then how it looks on the site:

3 Likes