Всем привет есть код сортировки:
<select class="selec" id="ids">
<option value="ids" selected>По типу</option>
<option value="id1" >Персональное использование</option>
<option value="id2" >Для учебных заведений</option>
<option value="id3" >Мелкосерийное производство</option>
</select>
<select class="selec" id="langs">
<option value="langs" selected>По производителю</option>
<option value="lang1" >PICASO 3D</option>
<option value="lang2" >MakerBot</option>
<option value="lang3" >3D Systems</option>
<option value="lang4" >PP3DP</option>
</select>
<div id="d-contents">
<div class="item border id1 id2 ids">
<img src="img/shop/12_pic.jpg" width="200" height="200">
<p><b>Space Monkey Gorilla</b> </p>
<button class="border" >Ок</button>
</div>
<div class="item border id1 ids">
<img src="img/shop/9_pic.jpg" width="200" height="200">
<p><b>PrintBox3D One</b></p>
<button class="border" >Ок</button>
</div>
<div class="item border id2 ids">
<img src="img/shop/9_pic.jpg" width="200" height="200">
<p><b>3D Print</b></p>
<button class="border" >Ок</button>
</div>
</div>
<div id="d-contents">
<div class="item border id1 id2 ids">
<img src="img/shop/12_pic.jpg" width="200" height="200">
<p><b>Awpa</b> </p>
<button class="border" >Ок</button>
</div>
<div class="item border id1 ids">
<img src="img/shop/9_pic.jpg" width="200" height="200">
<p><b>Prie</b></p>
<button class="border" >Ок</button>
</div>
<div class="item border id2 ids">
<img src="img/shop/9_pic.jpg" width="200" height="200">
<p><b>3D Dret</b></p>
<button class="border" >Ок</button>
</div>
</div>
var first=true;
$("select.selec").change(function () {
var a='';
$("select.selec").each(function () {
a+=$(this).val();
});
if(a=='###'){
$("#d-contents > div").show();
first=true;
return false;
}
if(first){first=false; $("#d-contents > div").hide();}
var a = $(this).val();
$("#d-contents > div."+a).show();
});
Проблема с сортировкой, если выбрать id1 выходит товар, а если сразу выбрать id2 то id1 и id2 смешаются...
Нужно добавить проверку классов, на форуме встретился код:
$('select').change(function() {
// прячем нужные блоки
$('div:not(#d-contents)').hide();
var selected = [];
var uniqueSelected = [];
// формируем массив значений options:selected
$("select option:selected").each(function() {
selected.push($(this).val());
});
// показываем блоки с классами, которые попали в массив selected
$.each(selected, function(index, val){
if (val!=='#') {
$('.'+val).show();
}
})
// составляем массив, состоящий из уникальных значений выбранных элементов в select-ах
uniqueSelected = $.grep(selected, function(v, k){
return $.inArray(v ,selected) === k;
});
// если массив равен ['#'] (что означает, что во всех селектах выбрано одно значение), то показываем все блоки
if (uniqueSelected.length===1) $('div:not(#d-contents)').show();
});
Но он удаляет все divы...
Пожалуйста помогите с кодом.
