How To Filter WIX Gallery Using Selection Tags.

Show and tell
, ,
18

Hi Jeff, thank you for watching my video :slight_smile:

Here is a code I used for a similar process. You only need to change the fieldkey, collection ID, and elements’ IDs

import wixData from 'wix-data';

const databaseName = 'fieldKey';
const databaseField = 'collectionID';

$w.onReady(function () {

    //SELECT ONE TAG AT A TIME AND FILTER WITH THAT TAG 🎉✨
    $w('#selectionTags1').onChange((event) => {
        const selectedTag = $w('#selectionTags1').value;

        for (var i = 0; i < selectedTag.length - 1; i++) {
            if (selectedTag.length > 1) {
                selectedTag.shift();

            }
        }

        setTimeout(() => {
            $w('#selectionTags1').value = [];
            $w('#selectionTags1').value = selectedTag;

            addItemstoRepeater(selectedTag);
        }, 1)

    });

    function addItemstoRepeater(selectedOption = []) {

        let dataQuery = wixData.query(databaseName);

        if (selectedOption.length > 0) {
            dataQuery = dataQuery.hasSome(databaseField, selectedOption);
        }

        dataQuery
            .find()
            .then(results => {
                const filtereditemsReady = results.items;
                $w('#repeater8').data = filtereditemsReady;

            });
    }

    //SHOW ALL RESULTS/RESET SELECTION 🤩
    $w("#resetButton").onClick(function () {
        $w("#dataset1").setFilter(wixData.filter());
        $w('#selectionTags1').value = [];
    });

});

Cheers!