lundi 9 mai 2016

All / none checkbox

Why doesn't this "All / none" option do his job? I can't see why .attr('checked', status); doesn't toggle all the checkboxes.

And what's the most clever way to hide / show elements of #main belonging to selected categories?

$('input[name="all"]').click(function() {
  var status = $(this).is(':checked');
  alert(status);
  $('input[type="checkbox"]').attr('checked', status);
});
<script src="http://ift.tt/1qRgvOJ"></script>
<div id="main">
  <div class="cat1">Element of category1</div>
  <div class="cat4">Element of category4</div>
  <div class="cat3">Element of category3</div>
  <div class="cat1">Element of category1</div>
  <div class="cat2">Element of category2</div>
</div>

<label>
  <input type="checkbox" name="all" checked="true">
  All / none
</label>
<label>
  <input type="checkbox" name="cat1" checked="true">
  A
</label>
<label>
  <input type="checkbox" name="cat2">
  B
</label>
<label>
  <input type="checkbox" name="cat3">
  C
</label>
<label>
  <input type="checkbox" name="cat4">
  D
</label>

Aucun commentaire:

Enregistrer un commentaire