Skip to main content

Bug Tracker

Side navigation

#9210 closed bug (duplicate)

Opened May 10, 2011 09:14AM UTC

Closed May 10, 2011 03:27PM UTC

Last modified February 26, 2013 05:16PM UTC

jquery can't check checkboxes after manual checks

Reported by: sejersen@gmail.com Owned by:
Priority: low Milestone: 1.6.1
Component: attributes Version: 1.6
Keywords: Cc:
Blocked by: Blocking:
Description

Code like

  $('#checkbox').attr('checked', true);

doesn't work when the target checkbox has been manually checked/unchecked. This is not an issue with jquery 1.5.2 but has appeared in 1.6. The bug exists in (at least) firefox 3.6.17 and Chromium 11.0.696.57, both running on ubuntu 10.10.

A complete example is as follows. First try to click on "check both" and see that both the other checkboxes are checked and unchecked. Then click on "check me" and click on "check both" again. Notice than "check me" aren't checked this time.

<html>
  <head>
    <title>Check the checked checkboxes</title>
    <script src="jquery-1.6.min.js" type="text/javascript"></script>
    <script type="text/javascript">
      $(function() {
        $('#check_both').change(function() {
          $('#checkme1').attr('checked', $(this).is(':checked'));
          $('#checkme2').attr('checked', $(this).is(':checked'));
        });
      });
    </script>
  </head>
  <body>
  
    <p>
      <input id="check_both"  name="check_both" type="checkbox"/>
      <label for="check_both">Check both</label>
    </p>

    <p>
      <input id="checkme1" name="checkme1" type="checkbox"/>
      <label for="checkme1">Check me</label>
    </p>

    <p>
      <input id="checkme2" name="checkme2" type="checkbox"/>
      <label for="checkme2">Check me as well</label
    </p>

  </body>
</html>
Attachments (0)
Change History (5)

Changed May 10, 2011 09:28AM UTC by sejersen@gmail.com comment:1

Never mind ... didn't see the other tickets about the issue, until after I submitted (the instructions was hidden among the 'are you at the right place' stuff).

The solution is (of course) to use .prop() instead of .attr().

Feel free to close the issue if you have the appropriate rights.

Changed May 10, 2011 03:27PM UTC by timmywil comment:2

component: unfiledattributes
milestone: 1.next1.6.1
priority: undecidedlow
resolution: → duplicate
status: newclosed

Changed May 10, 2011 03:27PM UTC by timmywil comment:3

Duplicate of #9191.

Changed February 26, 2013 05:02PM UTC by anonymous comment:4

Well, even if it was originally to forget, Thanks Sejersen@ :

It gave me an hint to solve a problem I had with a version of CheckboxTree plugin: http://code.google.com/p/checkboxtree/

The problem was that it was coded using .live() and .attr() functions.

It was still working (jQuery 1.9.1) when using jquery-migrate-1.0.1

When I replaced all .live statements with .on(), the behaviour of .attr() was modified. My knowledge of jquery changelog is unsufficient to find why it occurs but I needed to replace attr() statements by prop() ones and the widget is fully functional again.

Thanks again

Changed February 26, 2013 05:16PM UTC by dmethvin comment:5

It's in the upgrade guide, complete with code example.

http://jquery.com/upgrade-guide/1.9/#attr-versus-prop-