Issue with dataset filter - multi-reference field

I looked at other posts on similar issues, but since most of the posts I found were 2+ years old, I’m making a new one.

Here is the situation: I’m working on a product catalog demo. The page has two datasets, one for the product categories and the other for the products themselves. There are 6 dropdowns to filter the products. All of the filters work except one, and that is the product category. The productCategories field in the Products collection is a multi-reference field so that the products can be connected to multiple categories in the Categories collection. I have a button on the page that takes all the field values and runs the filter. Here is my code:

export function button2_click(event) {
let lumenval = $w( “#dropdownLumens” ).value;
let lumenparts = lumenval.split( ‘-’ );
let lumenmin = parseFloat(lumenparts[ 0 ]);
let lumenmax = parseFloat(lumenparts[ 1 ]);

let categoryVal = $w( “#dropdownCats” ).value;
let categoryParts = categoryVal.split( ‘.’ );
let catTitle = categoryParts[ 0 ];
let catIndex = parseFloat(categoryParts[ 1 ]);
console.log( 'category: ’ +catTitle+ ’ index: ’ +catIndex);

        $w( "#dataset2" ).setFilter( wixData.filter() 
            .eq( 'title' ,catTitle) 
        ) 
        .then( () =>{ 
              $w( "#dataset2" ).setCurrentItemIndex(catIndex); 

	   **let**  catObj = $w( "#dataset2" ).getCurrentItem(); 
               console.log(catObj.title+ ', ' +catObj._id); 

                $w( "#dataset1" ).setFilter( wixData.filter() 
                .between( "maxLumens" , lumenmin, lumenmax) 
                .contains( "colorTemperatures" , $w( "#dropdown1" ).value) 
                .contains( "watts" , $w( "#dropdown2" ).value) 
                .contains( "voltage" , $w( "#dropdown4" ).value) 
                .contains( "additionalOptions" , $w( "#dropdown5" ).value) 
                .contains( "productCategories" , catObj._id) 
            ) 
        }) 

}
Setting the currentItemIndex seems to be working, but I think I’m not doing the actual filter part right. I tried .eq( “productCategories” , catObj._id) and .includes( “productCategories” , catObj._id), but neither of those worked either. When I tried .includes, I got a “not a function” error. If I comment out the .contains( “productCategories” , catObj._id) line, the other filters work, so what am I doing wrong with this one?

I reworked things a bit and figured out a sort of solution. It may not be a great solution, but it works. Basically, I added a field to my collection called prodCats, and entered my product categories as comma-separated text, and used that field to filter the products instead of trying to use the ProductCategories reference field.

export function button2_click(event) {
let lumenval = $w( “#dropdownLumens” ).value;
let lumenparts = lumenval.split( ‘-’ );
let lumenmin = parseFloat(lumenparts[ 0 ]);
let lumenmax = parseFloat(lumenparts[ 1 ]);
let count = 0 ;
let catObj;
let categoryVal = $w( “#dropdownCats” ).value;
let catTitle;
let categoryParts = categoryVal.split( ‘.’ );
catTitle = categoryParts[ 0 ];

        $w( "#dataset1" ).setFilter( wixData.filter() 
            .contains( "prodCats" , catTitle) 
            .between( "maxLumens" , lumenmin, lumenmax) 
            .contains( "colorTemperatures" , $w( "#dropdown1" ).value) 
            .contains( "watts" , $w( "#dropdown2" ).value) 
            .contains( "voltage" , $w( "#dropdown4" ).value) 
            .contains( "additionalOptions" , $w( "#dropdown5" ).value) 
        ) 
    .then(() => { 
        $w( "#repeater3" ).forEachItem( ($item, itemData, index) => { 
            count +=  1 ; 
        } ); 
	 **if**  (count ===  0 ) { 
            	$w( "#text37" ).show(); 
        	} 
	 **else**  { 
            	$w( "#text37" ).hide(); 
        	} 
    }) 

}