Добрый день, с javascript у меня как то напряженно(
Есть фильтр товаров
http://rodmon.ru/katalog/zapchasti/shnekovye-pary
Подгружется по чек боксу динамически.
Добавил новый фильтр "Тип товара" и хотел сделать по аналогии
<?
asort($typezapList);
$ii = 10;
foreach ( $typezapList as $mm => $cc) {
?>
<div class="checkbox">
<input type="checkbox" id="check<?=$ii?>" data-type="<?=$mm?>">
<label for="check<?=$ii++?>"><?=$mm." (".$cc.")"?></label>
</div>
<?
}
?>
<!-- <a href="#">показать ещё</a> -->
</div>
<div class="vendor" id="catalogVendor">
<div class="h2 h3">
<strong>Производитель</strong>
</div>
<?
asort($manufList);
$i = 1;
foreach ( $manufList as $m => $c) {
?>
<div class="checkbox">
<input type="checkbox" id="check<?=$i?>" data-vendor="<?=$m?>">
<label for="check<?=$i++?>"><?=$m." (".$c.")"?></label>
</div>
<?
}
?>
<!-- <a href="#">показать ещё</a> -->
</div>
За динамическую вывод отвечает, как я понял, этот скрипт
var $ = jQuery;
var minPrice = Number($('#minCost').val());
var maxPrice = Number($('#maxCost').val());
// jQuery("#slider").slider({
// min: minPrice,
// max: maxPrice,
// values: [minPrice,maxPrice],
// range: true,
// stop: function(event, ui) {
// jQuery("#minCost").val(jQuery("#slider").slider("values",0));
// jQuery("#maxCost").val(jQuery("#slider").slider("values",1));
// filterUse();
// },
// slide: function(event, ui){
// jQuery("#minCost").val(jQuery("#slider").slider("values",0));
// jQuery("#maxCost").val(jQuery("#slider").slider("values",1));
// filterUse();
// }
// });
$( "#slider" ).slider({
range: true,
min: minPrice,
max: maxPrice,
values: [ minPrice, maxPrice ],
slide: function( event, ui ) {
jQuery("#minCost").val(ui.values[ 0 ]);
jQuery("#maxCost").val(ui.values[ 1 ]);
filterUse();
}
});
function filterUse(){
var count = 0;
$('#catalogList>.item').hide();
$('#catalogVendor input:checked').each(function(){
$('#catalogList>.item[data-vendor="'+$(this).attr('data-vendor')+'"]').show();
count++;
});
if(count == 0){
$('#catalogList>.item').show();
}
$('#catalogList>.item').each(function(){
if(Number($(this).attr('data-price')) < Number($('#minCost').val()) || Number($(this).attr('data-price')) > Number($('#maxCost').val())){
$(this).hide();
}
});
}
$('#catalogShowPrice').click(function(){;
filterUse();
return false;
});
$('#catalogClearPrice').click(function(){
$('#catalogList>.item').show();
jQuery("#minCost").val(minPrice);
jQuery("#maxCost").val(maxPrice);
$("#slider").slider( "values", 0, minPrice );
$("#slider").slider( "values", 1, maxPrice );
$('#catalogVendor input').attr('checked', false);
return false;
});
$('#catalogVendor input').click(function(){
filterUse();
});
jQuery("#minCost").change(function(){
var value1 = Number(jQuery("#minCost").val());
var value2 = Number(jQuery("#maxCost").val());
if(value1 == NaN) {value1 = minPrice;}
if(value2 == NaN) {value2 = maxPrice;}
if(value1 < minPrice){
value1 = minPrice;
}
if(value1 > value2){
value1 = value2;
}
jQuery("#minCost").val(value1);
jQuery("#slider").slider("values",0,value1);
filterUse();
});
// jQueryjQuery(".close").slider("disable");
jQuery("#maxCost").change(function(){
var value1 = Number(jQuery("#minCost").val());
var value2 = Number(jQuery("#maxCost").val());
if(value1 == NaN) {value1 = minPrice;}
if(value2 == NaN) {value2 = maxPrice;}
if (value2 > maxPrice) {
value2 = maxPrice;
$("#maxCost").val(1000)
}
if(parseInt(value1) > parseInt(value2)){
value2 = value1;
}
$("#maxCost").val(value2);
jQuery("#slider").slider("values",1,value2);
filterUse();
});
Если не сложно тут, сможет кто-нибудь подсказать как правильно расширить функции с учетом нового фильтра?
Что бы так же как в основном варианте подгружались товары
Спасибо!
