Grow your CSS skills. Land your dream job.

Toggle checkboxes [CodePen included]

  • # February 25, 2013 at 8:42 am

    I have a checkbox that when checked should toggle checkboxes in a form below.

    The function works perfectly on first iteration, however any time after that the checkboxes in the form are not checked.

    I’ve included a simplified version of my code in the CodePen below

    http://codepen.io/anon/pen/hldDI

    # February 25, 2013 at 9:14 am

    Solved, simply replace the attr function with prop and it will work as expected.

    # February 25, 2013 at 9:30 am

    Weirdest thing! Seems to me like a bug with setting checkboxes with `attr(‘checked’, …);`, you code should definitely be working. I found a workaround though, by simulating a click (also changed your code a bit so you can remove the onclick handler from your html)

    $(function() {
    var checkBoxes = $(‘.activity’);

    $(‘#get-last-quarter’).change(function() {
    var checked = $(this).prop(‘checked’);

    checkBoxes.each(function() {
    var $this = $(this);

    if ($this.prop(‘checked’) != checked)
    $this.click();
    });
    });
    })

    Edit: Ugh, I should refresh before submitting comments… xD Your solution is better.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".