cant check a checkbox a second time in jQuery

Question

I'm trying to manupilate the input checkbox however everytime i click on the label the first time the checkbox will be selected after that i click the label again and the checkbox is unchecked so far so good. But when i click the label again the checkbox will not be checked.

My jQuery code is as followed

$('.form-checkbox label').on('click', function(e) {
    e.preventDefault();

        if ($(this).hasClass('checked')) {

            $(this).removeClass('checked');
            $(this).find('span').removeClass('checked');
            $(this).find('input').attr('CHECKED', false);
        } else {

            $(this).addClass('checked');
            $(this).find('span').addClass('checked');
            $(this).find('input').attr('CHECKED', true);
        }
    });

And my HTML is as followed

<div class="form-checkbox">
   <label id="checkbox-checkbox">
      <input id="checkbox-checkbox" name="checkbox" value="option1" type="checkbox" /><span></span> Option 1
   </label>
</div>

As a side note, you should definitely not have 2 ids that are the same — Huangism, Jan 16 '14 at 20:03
Thanks i missed that one the label id should be a for attribute — Rick Schotte, Jan 16 '14 at 20:08

score 3 · Answer 1 · edited May 23 '17 at 12:20

3

Use .prop() instead of .attr()

 $(this).find('input').prop('checked', true/false);

See .prop() vs .attr()

edited May 23 '17 at 12:20

Community

1
1

answered Jan 16 '14 at 20:02

Satpal

132,252
13
159
168

score 0 · Answer 2 · answered Mar 13 '14 at 11:27

0

I think you should try this

$('.form-checkbox label').on('click', function() {
   var chk = $("#checkbox-checkbox").prop("checked");
   $("#checkbox-checkbox").prop("checked", !chk);
});

answered Mar 13 '14 at 11:27

Pinkesh Sharma

2,428
20
16

cant check a checkbox a second time in jQuery

2 Answers2