The modification of the checked attribute of a checkbox doesn't work correctly

Question

I have a rails view that displays a checkbox. When I click on the checkbox, a rjs function is called in my controller and it checks or unchecks the checkbox according to its previous state.

In the view :

<%= check_box_tag 'checkbox_test' %>

<%= observe_field 'checkbox_test',
  :url => { :action => :test_checkbox }
%>

In the controller :

def test_checkbox
  render :update do |page|
    page << "
      var checkBox = $('checkbox_test');
      checkBox.checked = !checkBox.checked;
    "
  end
end

The first time I click on the checkbox, everything works correctly, the function is called and the checked attribute is changed. The problem comes after: if I click again on the checkbox, the attribute doesn't change (but visually the checkbox changes...) and therefore the function "test_checkbox" is not called.

How can I solve this problem?

It looks like you have edited your question to have working code instead? What gives? — Esailija, Jul 30 '12 at 09:48
It still doesn't work. I just remove a copying error in the code. — Jerem, Jul 30 '12 at 09:59

score 2 · Answer 1 · answered Jul 30 '12 at 09:44

2

Don't use the attribute at all. Just use the checked property. This is good advice for nearly every attribute and situation.

var checkBox = $('checkbox_test');
checkBox.checked = !checkBox.checked;

answered Jul 30 '12 at 09:44

Tim Down

318,141
75
454
536

score 1 · Answer 2 · answered Mar 04 '13 at 09:35

1

Seems to me you need $('checkbox_test')[0].checked to test checkedness.

checked property is a native DOM thing, not part of jQuery.

answered Mar 04 '13 at 09:35

Jim

521
8
14

I tried with `$('checkbox_test')[0].checked` and the behavior is the same as if I use `$('checkbox_test').checked` – Jerem Mar 05 '13 at 13:34

The modification of the checked attribute of a checkbox doesn't work correctly

2 Answers2