не выводит результаты по диапазону
введите сюда кодНе могу понять, почему с одним ползунком выводит результаты. А вот с диапазоном нет. Помогите решить проблему. Слайдер на jquery ui
$(document).ready(function(card){
$("#slider_card").slider({
range: true,
values: [ 50000, 300000 ],
value: 300000,//Значение, которое будет выставлено слайдеру при загрузке
min: 50000,//Минимально возможное значение на ползунке
max: 300000,//Максимально возможное значение на ползунке
step: 10000,//Шаг, с которым будет двигаться ползунок
slide: onSlide,
stop : function() {
$('.block-kol').fadeTo(0,1)
}
});
$("#slider_card2").slider({
range: true,
values: [ 0, 36 ],
value: 36,//Значение, которое будет выставлено слайдеру при загрузке
min: 5,//Минимально возможное значение на ползунке
max: 36,//Максимально возможное значение на ползунке
step: 1,//Шаг, с которым будет двигаться ползунок
slide: onSlide,
stop : function() {
$('.block-kol').fadeTo(0,1)
}
});
function onSlide(e, ui) {
$('.block-kol').fadeTo(0, 0.5);
$(this).closest('.filter-block').find('.left-nomer-value').html(ui.values[ 0 ]);
$(this).closest('.filter-block').find('.right-nomer-value').html(ui.values[ 1 ]);
setTimeout(showItems);
}
function showItems() {
const
price = $('#slider_card').slider('value');
days = $('#slider_card2').slider('value');
$('.card-offer').each(function() {
const $this = $(this);
$this.toggle(
price >= parseInt($this.find('.sm-card').text().replace(/\D/g, '')) &&
days >= parseInt($this.find('.sr-card').text().replace(/\D/g, ''))
);
});
$('.no-offer').toggle(!$('.card-offer:visible').length);
}
showItems();
});
<div class="filter" id="nal">
<div class="filter-block">
<div class="filter-banner">Стоимость курса:</div>
<div class="filter-left-nomer left-nomer-value">50000</div>
<div class="filter-left-nomer">руб.</div>
<div class="filter-right-nomer">руб.</div>
<div class="filter-right-nomer right-nomer-value" id="contentSlider1">300000</div>
<div class="clr"></div>
<div id="slider_card" class="slider1"></div>
</div>
<div class="filter-block">
<div id="ui-slider-range"></div>
<div class="filter-banner">Длительность обучения:</div>
<div class="filter-left-nomer left-nomer-value">5</div>
<div class="filter-left-nomer">мес.</div>
<div class="filter-right-nomer">мес.</div>
<div class="filter-right-nomer right-nomer-value" id="contentSlider2">36</div>
<div class="clr"></div>
<div id="slider_card2" class="slider1"></div>
</div>