toggling checkboxes works well only once, any ideas?

mimhof

Greetings...thought I'd post this as a forum question too....just sent in a private help request on it in the meantime (all sides against the middle as I am crunching lots of code - sorry if that is annoying to post it twice delete as you see fit plz.).

Hi...I have an event that triggers

 $('input', table.cells().nodes()).attr('checked',true);

to check all check boxes and I can toggle it later to uncheck and it calls

 $('input', table.cells().nodes()).attr('checked',false);

I have a different event that captures all the values checked as:

var checkedValues = $('input[name="w-my-ckbox[]"]:checked').map(function() {
                             return this.value;
                }).get();

And it properly returns the value of each input as an array.

But my problem is that the checkbox toggle only works right the first time...toggles them all on, then toggles off, and when I go back to toggle again it does not work like the first time - all visually marked and all counted properly in checkedValues. Specifically, in firebug I can see it is adding the checked="checked" and removing it...but two things 1) it does not update the checkbox onscreen like it did the first time...and...checkedValues returns an empty array.

What are your thoughts on this issue?

By the way, adding

table.draw();

afterwards does not help it.

mimhof

.

mimhof

Follow up comment here Allan, I figured out per http://api.jquery.com/prop/ that attr:
"...the most important concept to remember about the checked attribute is that it does not correspond to the checked property. The attribute actually corresponds to the defaultChecked property and should be used only to set the initial value of the checkbox. The checked attribute value does not change with the state of the checkbox, while the checked property does. Therefore, the cross-browser-compatible way to determine if a checkbox is checked is to use the property...."

So changing to the following fixes the issue.

$('input', table.cells().nodes()).prop('checked',true);  

and

$('input', table.cells().nodes()).prop('checked',false);  

allan

This is correct - for jQuery use $().prop() to change properties.

Allan