Массив фильтров Jquery со значениями флажков и новым массивом вывода

Question

У меня есть массив:

var arrayList = [{"color":"red","size":small"},{"color":"brown","size":medium"},{"color":"red","size":large"}];

с флажками:

<input name="red" type="checkbox" value="red" />
<input name="brown" type="checkbox" value="brown" />
<input name="small" type="checkbox" value="small" />
<input name="large" type="checkbox" value="large" />

Мне нужно иметь возможность фильтровать массив, используя значения флажков для вывода нового массива.

Если я проверил 'красный', новый массив должен быть:

var arrayList = [{"color":"red","size":small"},{"color":"red","size":large"}];

, а если я проверил 'красный' и 'большой', я получу:

var arrayList = [{"color":"red","size":large"}];

Спасибо за любую помощь в этом.

Мне нужно прояснить мою проблему, вот мой код фильтра:

//this is the top level array generated with all products
    var product = [{"price":"200","color":"red","size":small"},{"price":"250","color":"brown","size":medium"},{"price":"300","color":"red","size":large"}];

// displayed products array
    var filterdProducts = [];  
            var key = 0;

        //start of price range filter
            if(!minPrice && !maxPrice){
                filterdProducts = products;
            } else{
                $.each(products, function(i, object) {   
                    var curentPrice = parseFloat(object.price); 
                    var priceMinOk = true;
                    var priceMaxOk = true;
                    // filter results match the price range
                    if(maxPrice || minPrice){
                        if(maxPrice && maxPrice<curentPrice){
                            priceMaxOk = false;
                        }
                        if(minPrice && minPrice>curentPrice){
                            priceMinOk = false;
                        }
                    }  
                    //  loop over list and get only related to new array
                     if( priceMinOk && priceMaxOk ){  
                        filterdProducts[key] = object;                  
                        key++;

                     }  

                });
            } 

Мне нужно добавить функциональность флажков в этот фильтр, чтобы я мог такжефильтр по размеру и цвету.Надеюсь, это поможет

Answer 1

Попробуйте это

var arrayList = [{"color":"red","size":"small"},{"color":"brown","size":"medium"},{"color":"red","size":"large"}];
var newArrayList = [];


   if($("input[value=red]").checked){
       if($("input[value=large]").checked){
         newArrayList.push({"color":"red","size":"large"});
       }
       else{
          newArrayList.push({"color":"red","size":"small"}).push({"color":"red","size":"large"});
       }

   }