Changing the order of dropdown items in list connected to CMS

Ask the community
, , ,
8

You can do it in code.

Just change the code to use you collection, dataset and tags etc.
Do not connect the dropdown in the UI


$w.onReady(function () {
    //== Query the collection directly
    wixData.query('ShowDaysRefCms') //== Replace 'CollectionName' with your  collection ID
        .descending('showDays') // Sort by the 'your collection field' field in ascending order
        .find()
        .then(results => {
            if (results.items.length > 0) {
                const dropdownOptions = results.items.map(item => ({

                   
                    label: item.showDays, //== Use the 'ShowDays' field for the dropdown label
                    value: item.showDays      //== Use the item's ID or another unique value for the value
                }));
 console.log(dropdownOptions)
                //== Set the dropdown options
                $w('#dropdown1').options = dropdownOptions; // Replace with your dropdown ID
            } else {
                console.warn('No items found in the collection');
            }
        })
        .catch(err => {
            console.error('Error querying collection:', err);
        });

        //== Add event listener for dropdown change
    $w('#dropdown1').onChange(() => {
        const selectedValue = $w('#dropdown1').value;

        if (selectedValue) {
            //== Filter dataset based on the dropdown value
            const dataset7 = $w('#dataset7'); //== use you dataset name
            dataset7.setFilter(wixData.filter().eq('showDays', selectedValue))
                .then(() => {
                    console.log(`Dataset7 filtered by showDays: ${selectedValue}`);
                })
                .catch(err => {
                    console.error('Error filtering dataset7:', err);
                });
        }
    }); 
})