Checkbox Filter Using Search Button > Appear on Lightbox with Repeater

Ask the community
, ,
3

Hey, first of all, thank you for responding to my question, appreciated it man.
I’ve followed all your code as much as I can understand (as I mentioned before I’m not a devs nor have coding background, sry lol).

But some issues appear:

  • The symptoms name doesn’t load into the checkbox list
  • The search button doesn’t call the lightbox and so the result

Here’s my updated code:

import wixData from 'wix-data';
import wixWindow from 'wix-window';

//---------- USER INTERFACE ----------
const dbProducts = "Products";
const dbSymptoms = "Symptoms";
const REP1 = "#repeater1";
const CHB1 = "#checkbox1";

let symptomsCB = [];

//---------- FUNCTION 1 ----------
$w.onReady(async () => {

    let symptomData = await loadSymptoms(dbSymptoms);
    console.log("Symptoms: ", symptomData);

    $w(REP1).data = [];

    $w(REP1).data = symptomData;

    $w(REP1).onItemReady(($item, itemData, index) => {
        $item('#text1').text = itemData.value;
        $item(CHB1).onClick(async () => { get_Symptoms(); });
        $item('#text1').text = itemData.value;
    });
});

function loadSymptoms(DB) {
    wixData.query(DB)
        .find()
        .then(results => {
            let symptomsDropdownOptions = [];
            symptomsDropdownOptions.push(...results.items.map(symptoms => {
                return { _id: symptoms._id, value: symptoms.title, label: symptoms.title };
            }));
            return symptomsDropdownOptions;
        });
}

//---------- FUNCTION 2 ----------
function get_Symptoms() {
    $w("#repeater1").forEachItem(($item, itemData, index) => {
        let text = $item('#text1').text;
        if ($item("#checkbox1").checked) {
            symptomsCB.push({ id: $item(CHB1).id, value: text, label: text });
        }
    });
}

//---------- FUNCTION 3 ----------
$w.onReady(async () => {
    function searchFunction() {
        $w(REP1).forEachItem(($item, itemData, index) => {
            if ($item(CHB1).checked) {
                symptomsCB.push($item('#text1').text);
            }
        });

        let query = wixData.query(dbProducts);

        for (let i = 0; i < symptomsCB.length; i++) {
            query = query.hasAll("symptoms", symptomsCB[i]);
        }

        query.find().then(results => {
            const filteredResults = results.items.filter(item => {
                return symptomsCB.every(symptom => item.symptoms.includes(symptom));
            });

            wixWindow.openLightbox("Lightbox1").then(() => {
                $w('#repeaterLB').data = filteredResults;
            });
        });
    }

    $w('#searchButton').onClick(() => {
        searchFunction();
    });
});

//---------- FUNCTION 4 ----------
$w.onReady(() => {
    $w('#clearButton').onClick(() => {
        $w(REP1).data.forEach(item => {
            $w(CHB1).checked = false;
        });
        $w("#dataset1").setFilter(wixData.filter());
    });
});

Can you please kindly check it again? Thank you~