jeudi 21 juillet 2016

Checkbox filters with "only" button

I have 6 checkboxes in a sidebar. When the page load they are already checked.

When you hover on each checkbox a "only" link on the right side is appearing.

I have one problem. When you click on the "only" link its working but when i am going to another checkbox after all are unchchecked and click on the "only" link it is not checking the checkbox.

Any advice how to do it?

$('li').hover(function () {
    $(this).append('<a href="#" id="only-link">only</a>');

    $('li #only-link').click(function (e) {
        e.preventDefault();
        $('input:checkbox').not($(this).siblings('input:checkbox')).prop('checked', false);
    });
}, function () {
    $('#only-link').remove();
});
<script src="http://ift.tt/1oMJErh"></script>
<ul>
  <li><input type="checkbox" checked></li>
  <li><input type="checkbox" checked></li>
  <li><input type="checkbox" checked></li>
  <li><input type="checkbox" checked></li>
</ul>



Aucun commentaire:

Enregistrer un commentaire