Correct way of knowing if a checkbox is checked

Question

Possible Duplicate:
Check if checkbox is checked with jQuery

I am a little bit confused about how the input of type checkbox works.

If I set a value, say 1, on a checkbox, I see that regardless of the checkbox is checked or not, the value that I get when the form is submitted is 1.

<input type="checkbox" value="1">

So, the correct way to see if a checkbox is checked is to use the checked from jQuery? Or how it can be done correctly?

No, I just want to know if I have to do it with jQuery, or if I can use the value to do so. — Hommer Smith, Nov 02 '12 at 11:20

score 6 · Accepted Answer · edited May 23 '17 at 11:45

Checkbox values should not get submitted if they are not checked.

If you want to check with jQuery, I would always use:

var isChecked = $('#checkbox').prop('checked');

Or

var isChecked = $('#checkbox').is(':checked');

With JavaScript, you have to understand the difference between attributes and properties. checked is both a property and an attribute. However, the attribute checked isn't always updated when the checked property of a checkbox changes (in some browsers it is). Think of the attribute as the value in the HTML markup parsed by the DOM. The checked property is an actual member of the checkbox element in the DOM, which always changes based on whether the box is checked or unchecked in the UI.

If you want to try a foolproof method without needed JavaScript, you can try it the "MVC" way, by rendering a hidden input and a checkbox with the same name, each with appropriate "checked"-state values:

<input type="hidden" name="mybox" value="false" />
<input type="checkbox" name="mybox" value="true" />

When you submit the form, if you can't find a mybox value in the request with a value of "true" then the checkbox was not checked. More about that here.

So, you can't use the value attribute to decide. It's value is the same whether is checked or not. You always have to check if is checked or not. Right? — Hommer Smith, Nov 02 '12 at 11:24
@HommerSmith: Unfortunately the `value` attribute behaves differently in various browsers as to whether form submitting includes the value whether it is checked or not. I made an edit that shows the "MVC" way -- a sort of fool-proof method to know whether a checkbox was really checked. — Cᴏʀʏ, Nov 02 '12 at 11:26

score 1 · Answer 2 · answered Nov 02 '12 at 11:26

1

in order to check if the checkbox is actually checked you must use

'boxname.checked==""

as the value will always be there even if the box is not checked.

answered Nov 02 '12 at 11:26

Shurmajee

1,027
3
12
35

score 0 · Answer 3 · answered Nov 02 '12 at 11:23

0

$('input[type=checkbox]').is(':checked')

This returns true if checked, and false if not.

In answer to your comment on the question, there is not much to be gained by the value when you need the checked state.

answered Nov 02 '12 at 11:23

Abhilash

1,610
9
19

score 0 · Answer 4 · answered Nov 02 '12 at 11:25

0

check is the property of checkbox tag, so u have to check if it is set, no other value.

answered Nov 02 '12 at 11:25

Mansoor Jafar

1,458
3
15
31

Correct way of knowing if a checkbox is checked

4 Answers4