Фильтр Jquery с несколькими критериями

Я пытаюсь отфильтровать список ресторанов на основе их влияния. Я хотел бы использовать ползунки вместо общих категорий, таких как индийская / азиатская / мексиканская / европейская кухня.

Ресторан может быть

[{restaurant: 
    {name: 'The Apollon',
    thumb: 'apollon.jpg',
    type: 
        [{spicy: 5, type_id: 1}
        {garlic:3, type_id:2}
        {expensive:10, type_id:3}]}
}]

Затем я бы использовал общий слайдер JQuery UI и передавал значение от каждого слайдера к скрытому элементу.

Здесь я совершенно застрял. Я могу заставить его работать на одном слайдере, используя классы вместо JSON( .nospice .somespice .spicy) и выполняя if (value >= 7) {$('.spicy').show();}, но я не уверен, как бы я делал более сложные запросы (if x = >=7 AND y = >=3 AND z = >=5)

Кто-то хочет подтолкнуть меня в правильном направлении здесь? Что мне нужно, чтобы читать дальше. Если я пойду по этому поводу фантастически неправильно, пожалуйста, расскажите.

jsfiddle: http://jsfiddle.net/techii/9e2cJ/

1 ответ

Решение

JQuery имеет .filter метод. Я бы также порекомендовал вам хранить объект ресторана с помощью div, используя .data сохранить название и тип ресторана с его div:

$(".restaurants > div").filter(function(){
   var info = $(this).data("info");
   // Some code to extract things like spicyness, expensiveness
   // Also some code to get the slider values...
   if (spicynessSliderValue <= spicyness && expensivenessSliderValue <= expensiveness)
   {
       return true;
   }
}).show();

В вашем случае я бы предложил использовать $.each тем не мение:

$(".restaurants > div").each(function(){
   ...
   var isMatch = picynessSliderValue <= spicyness && expensivenessSliderValue <= expensiveness;
   $(this).toggle(isMatch); // like .show or .hide, but takes a boolean
})
Другие вопросы по тегам