CODEWITHSUNDEEP
javascriptjquery
mpen
mpen

Reputation: 282845

Why don't these checkboxes work as expected?

See fiddle

  1. Click on "jQuery". "latest stable" gets checked
  2. Click it again. "latest stable" gets unchecked
  3. Click on "latest stable". "jQuery" gets checked
  4. Click it again. "jQuery" gets unchecked
  5. Click "jQuery"
  6. Click "latest stable"; they get out sync

Why? I'm trying to get them to stay in sync (I.e. if any of the sub-checkboxes are checked, the parent should be checked, and vice-versa. Clicking the unchecked parent should check the top child, otherwise if it's already checked, it should uncheck all children). It appears that checktop.checked doesn't accurately reflect the UI.

Edit: Tested in FF7, Chrome 16, IE9.

updated fiddle -- This alerts "i'm checked" (if you follow the instructions) when I'd expect it to say "i'm not checked" because you've just unchecked it, and the change event should fire afterwords.

Upvotes: 4

Views: 116

Answers (2)

vol7ron
vol7ron

Reputation: 42099

I only notice this happening when:

  1. click jQuery
  2. unclick latest stable (at this point)
  3. unclick jQuery

If you use the prop function instead of attr, it should work accordingly. I notice that Dr. Molle and I arrived at the same conclusion at almost the same time :)

Upvotes: 2

Dr.Molle
Dr.Molle

Reputation: 117324

Replace all occurences of "attr()" with "prop()" http://jsfiddle.net/Cqt5Q/8/

Upvotes: 7

Related Questions