Checkbox Filter Using Search Button > Appear on Lightbox with Repeater

Ask the community
, ,
9

Try this one…
See if this works for you.
If it works, understand it first, before you start to add more codings…


import wixWindow from 'wix-window';

//---------- USER INTERFACE ----------
const dbProducts = "Products";
const dbSymptoms = "Symptoms";

$w.onReady(async()=> {
    //getting SYMPTONS-DATA...
    //-----------------------
    let symptomData = await loadSymptoms(dbSymptoms);
    console.log("Symptoms: ", symptomData);

    //resetting your repeater...
    //-----------------------
    $w("#repeater1").data = [];

    //feeding your repeater with found SYMPTOMS-DATA...
    //-----------------------
    $w("#repeater1").data = symptomData;

    //Do actions, when repeater loads (has loaded) items...
    //-----------------------
    $w("#repeater1").onItemReady(($item,itemData,index)=>{
        console.log("Item-Data: ", itemData);
        $item('#text1').text = itemData.value;
        $item('#checkbox1').onClick(async()=> { 
            let foundSymptoms = await get_Symptoms(); 
            console.log("Found-Symptoms: ", foundSymptoms);
            $w("#resultRepeater").data = foundSymptoms;
        });
        $item('#text1').text = itemData.value;
    });
        
    $w("#resultRepeater").onItemReady(($i,iData,index)=>{
        //...complete result-repeater-code...
        //...complete result-repeater-code...
        //...complete result-repeater-code...
        //...complete result-repeater-code...
        //...complete result-repeater-code...
    });

    //-----------------------
    $w('#clearButton').onClick(() => {
        $w("#repeater1").forEachItem(($item) => {
            $item('#checkbox1').checked = false;
        });
    });
});


//---------- FUNCTION-1 ----------
function loadSymptoms(DB) {
    return 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() {
    let symptomsCB = [];
    $w("#repeater1").forEachItem(($item,itemData,index) => {
        let text = $item('#text1').text;
        if ($item("#checkbox1").checked) {
            symptomsCB.push({id:itemData._id, value:text, label:text});
            return symptomsCB;
        }
    });
}

Not tested !!!

Pay attention onto CONSOLE-LOGS,they will help you to understand the CODE…
Add more logs into your CODE —> if needed for further investigations…

This example do not include the LIGHTBOX-functionality.
This example do not include the SEARCH-FUNCTION.
This example works without DATASET-CONNECTIONS.