How do I get checkboxes to show 1 or more selections of data rather than filter OUT data (using a repeater)?

Discussion Ask a question
,
1

I have a page of distributors, and three categories of products. Each distributor carries 1, 2, or all 3 of the product categories. All of this information is held in a database collection and is displayed in a repeater, and three checkboxes are shown above so you can find which distributors carry which of the product lines. The page looks like this:

992×874 117 KB

The categories are FOTM, PTM, and FO Links, shown here in the collection (there is also a drop box filtering the region, and that is working great right now):

1018×739 30.8 KB

I would like the page to show ALL distributors on loading, with all three checkboxes ticked. Then when one checkbox is ticked, only the distributors who carry that one product line should show. Two checkboxes should show distributors who carry one or the other, or BOTH product lines, and when all three boxes are ticked, it should show all the distributors, because they all carry at least one of the product lines.

Currently the checkboxes filter out the distributors who carry ONLY the specified combination of products, and does not include the distributors who carry one or the other product, even though the boxes for those categories are ticked. So the more checkboxes ticked, the SMALLER the number of distributors shown, rather than bigger.

How do I make the checkboxes INCLUSIVE (ie- they show distributors who carry one, two OR three of the boxes checked?).

Here is my code:

702×616 16.8 KB

2

@yisrael-wix could you assist with this query please? You seem to be a code guru! Thank you

3

@code-queen any suggestions please?

4

@Sara

I can’t be bothered to code all the different combinations but you get the idea…

//fotm, ptm, fol are the field keys for your database, change as necessary for your specific site

const fotmResults = wixData.filter().eq(“fotm”, true );
const ptmResults = wixData.filter().eq(“ptm”, true );
const fotmAndPtmResults = fotmResults.or(ptmResults)

//FOTM, PTM, FOL are the IDs for the checkboxs, change as necessary for your specific site

if (($w(‘#FOTM’).checked === true ) &&
($w(‘#PTM’).checked === false ) &&
($w(‘#FOL’).checked === false ))
{

//change dattaset1 ID as necessary for your specific site

    $w('#dataset1').setFilter(fotmResults) 
   }

if (($w(‘#FOTM’).checked === false ) &&
($w(‘#PTM’).checked === true ) &&
($w(‘#FOL’).checked === false ))
{

//change dattaset1 ID as necessary for your specific site

    $w('#dataset1').setFilter(ptmResults) 
   }

if (($w(‘#FOTM’).checked === true ) &&
($w(‘#PTM’).checked === true ) &&
($w(‘#FOL’).checked === false ))
{

    $w('#dataset1').setFilter(fotmAndPtmResults) 

   }