i have multiple articles shown in a div the function will hide all items first i go in each div item in the items and see if its classlist contains the filter to show
the code:
div class="filter">
<h1>Select products</h1>
<div class="checkbox"> <label><input type="checkbox" rel="" onchange="change();" checked="checked" />ALL</label> </div>
<div class="checkbox"> <label><input type="checkbox" rel="TABLET" onchange="change();" />TABLET</label> </div>
<div class="checkbox"> <label><input type="checkbox" rel="MEDICAL" onchange="change();" />MEDICAL</label> </div>
<div class="checkbox"> <label><input type="checkbox" rel="TISANE NATUREL" onchange="change();" />TISANE NATUREL</label> </div>
</div>
<div id="items">
<div class="column #MEDICAL# #TABLET#">
<div class="content">
<h4>XLS MEDICAL - COMPRIME [FAT REDUCER] {120}</h4>
<p style="color:blue">Product Ref.: 4384145</p>
<p style="color:blue">Product Barcode: 5400951001098</p>
</div>
</div>
<div class="column #MEDICAL# #TABLET#">
<div class="content">
<h4>XLS MEDICAL - COMPRIME [MAX STRENGTH] {120}</h4>
<p style="color:blue">Product Ref.: 3214897</p>
<p style="color:blue">Product Barcode: 5414963013147</p>
</div>
</div>
<div class="column #TISANE NATUREL#">
<div class="content">
<h4>XLS MEDICAL - TISANE [FROID] {20}</h4>
<p style="color:blue">Product Ref.: 3045382</p>
<p style="color:blue">Product Barcode: 5412141225559</p>
</div>
</div>
</div>
<script>
function change() {
let results = Array.from(document.querySelectorAll('.row > div')),
selectedFilters = document.querySelectorAll('.filter input.models:checked');
results.forEach(function (result) { result.style.display = 'none'; });
selectedFilters.forEach(function (filter) {
results.forEach(function (item) {
if (Array.inArray(item.classList, filter.getAttribute('rel')) != -1) { item.style.display = 'block'; };
});
});
}
change();
</script>
i have tried to change the results to ".row > content" it hides all the item without showing any
my code is not working, thanks for help.
Aucun commentaire:
Enregistrer un commentaire