dynamic "and" query in taffy DB

Question

I am trying to filter my taffy database and I have some drop-down which allows the user to choose the filter:

<select name="selectOPtions"  id="typeSelect" >
<option value="all">All Types</option>
</select>
<select name="selectOPtions" id="countrySelect" >
<option value="all" >All Countries</option>
</select>
<select name="selectOPtions" id="provinceSelect">
<option value="all" >All Provinces</option>
</select>
<select name="selectOPtions" id="citiesSelect" >
<option value="all">All Cities</option>
</select>

suppose that the ajax response contains our db and so we have:

Stores=TAFFY(response);

I have filled the drop-downs based on this logic:

   allCountries=Stores().distinct("country");
    var $countries=$('#countrySelect');
    $.each(allCountries, function(id, cc){
        if(cc!=null && cc!=''){
            $countries.append('<option value="'+cc+'"> '+paese.toUpperCase()+'</option>');
      }     
        
    });

then I collected all the values the user might choose in an array as the filtering query:

  $('select[name=selectOPtions]').on('change', function(){
                  myFilter=[];
                 chosenType=$('#typeSelect').children("option:selected").val();
                 chosenCountry=$('#countrySelect').children("option:selected").val();
                 chosenProvince=$('#provinceSelect').children("option:selected").val();
                 chosenCity=$('#citiesSelect').children("option:selected").val();
                 if(chosenType!=null && chosenType !="" && chosenType!="all"){
                      myFilter.push({type:chosenType});
                 }
            if(chosenCountry!=null && chosenCountry!="" && chosenCountry!="all"){ 
                 myFilter.push({country:chosenCountry});
             }
             
            if(chosenProvince!=null && chosenProvince!="" && chosenProvince!="all"){
             myFilter.push({province:chosenProvince});
            }
            
            if(chosenCity!=null && chosenCity!="" && chosenCity!="all"){    
                myFilter.push({city:chosenCity});
            }

 list=Stores(myFilter).get();

to show the result:

var $storesShow=$('#storesSelect');
                 $storesShow.empty();

                 $.each(list, function(id, rec){
                     if(rec !=''){
                        $storesShow.append('<option value="'+rec.store_code+'"> '+rec.type+"-"+rec.country+ "-"+rec.city+'</option>');
                     }
                    });
             });

when I choose some filters, it does not return the correct result. I can make an example: if I want the taffy returns all the records where the country="Italy" AND type="DEMO" ,it is returning the "OR" results. Thank you!

Answer 1

Ok I found the result. the problem was that array in taffy means OR. I share part of the results to have the main concept:

$('select[name=selectOPtions]').on('change', function(){
                  var object = {};
                  var operator = "===";
                  var chosenType=$('#typeSelect').children("option:selected").val();
                  var chosenCountry=$('#countrySelect').children("option:selected").val();
                  var chosenProvince=$('#provinceSelect').children("option:selected").val();
                  var chosenCity=$('#citiesSelect').children("option:selected").val();


if(chosenType!=null && chosenType !="" && chosenType!="all"){
                      var column ="type";
                      object[column]={};
                      object[column][operator]=chosenType;
                      console.log(object);
                      list=Stores(object).get();

                 }

// ... // the same for other dropdowns

console.log(list);

                var $storesShow=$('#storesSelect');
                 $storesShow.empty();

                 $.each(list, function(id, rec){
                     if(rec !=''){
                        $storesShow.append('<option value="'+rec.store_code+'"> '+rec.type+"-"+rec.country+ "-"+rec.city+" "+rec.addressLine1+'</option>');
                     }
                    });
             });