Фильтр 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
})