Get checkbox selected state with JQuery

Question

I tried many ways to get the selected state of a checkbox. Its a input field with type checkbox.

I tried the following methods to get the state, but all returns false. Only if the checkbox was set selected/not selected with jQuery before (this was done with $.prop("checked", "true").

$("#ID").prop("checked");
$("#ID").val(); //returns "on" everytime
$("#ID").attr("checked");
$("#ID").checked; //undefined

ID is a real id in my Code!

The selected state is also set with jQuery like this:

$(columns[i]).children().first().prop("checked", stateArray[i]);

The checkboxes are in a KendoGrid and columns.children gets all td's and first() returns the input.

stateArray is an array with true/false.

Nothing works... Do you got an idea?

Regards

EDIT: I found the fault... the ID generated for the inputs was always the same... so it selected the first element which was not selected... I'm sorry for that!

First select `checkbox` from `DOM` then read its `checked` property. — Mohammad Usman, Aug 08 '16 at 07:10
'' This is the object. I select it via JQuery with ID Selector — szmast3r, Aug 08 '16 at 07:13
`.prop` and `.attr` should work. Please show how you are actually using them. — John C, Aug 08 '16 at 07:15
'var checkState = $("#" + target.id).prop("checked"); var id = equipmentDGM.getSelectedHiddenValue("hidden_id"); checkState = checkState == "true" ? "false" : "true";' This is how i use the checkbox with an OnChange event. It always show "false" — szmast3r, Aug 08 '16 at 07:17
Possible duplicate of [get current state of check box jquery](http://stackoverflow.com/questions/23911602/get-current-state-of-check-box-jquery) — Jon Koops, Aug 08 '16 at 07:25

score 2 · Answer 1 · answered Aug 08 '16 at 07:09

2

Where is your selector? Use is(":checked") with it like following.

var status = $(':checkbox').is(":checked");

answered Aug 08 '16 at 07:09

Ibrahim Khan

20,616
7
42
55

Then use it like `$("#ID").is(":checked")` @szmast3r – Ibrahim Khan Aug 08 '16 at 07:18
dont work either :/ it returns false... Ill edit the start post and show how i set it selected or not selected... maybe that helps – szmast3r Aug 08 '16 at 07:27

Rahul Patel · Answer 2 · 2016-08-08T09:24:23.520

1

To find checkbox checked or not use $('input[type="checkbox"]').prop("checked")

For more understanding check below snippet.

$('input[type="checkbox"]').on('change',function(){
  if($(this).prop('checked')){
    alert("checked");
  }else{
    alert("un-checked");  
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox"/>

edited Aug 08 '16 at 09:24

answered Aug 08 '16 at 07:13

Rahul Patel

5,248
2
14
26

Do i get a specific Element in a Grid? wont it return every input with type checkbox in my grid? I also need the selected row for a SQLQuery – szmast3r Aug 08 '16 at 07:46
Please my check my updated answer. If you have multiple checkbox then in that case you can use "on change" event listener of jquery and $(this) to get the status of checkbox. – Rahul Patel Aug 08 '16 at 09:25

score 0 · Answer 3 · answered Aug 08 '16 at 07:17

You need to select checkbox from DOM first then read its checked property.

$(function() {
  console.log($('#ab3fee6b-c81e-e4ba-b12e-2c088bb386cc_A4').prop('checked'));
  console.log($('#ab3fee6b-c81e-e4ba-b12e-2c088bb386cc_A5').prop('checked'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id="ab3fee6b-c81e-e4ba-b12e-2c088bb386cc_A4" type="checkbox" data-role="check" otg-visible="true" style="-webkit-appearance: checkbox !important; width: 20px; height: 20px; display: table-cell; margin: 0px;">
<input id="ab3fee6b-c81e-e4ba-b12e-2c088bb386cc_A5" type="checkbox" data-role="check" checked otg-visible="true" style="-webkit-appearance: checkbox !important; width: 20px; height: 20px; display: table-cell; margin: 0px;">

i tried this already... dont work :/ Changing the selected state with .prop("checked", "true/false") works... but not reading — szmast3r, Aug 08 '16 at 07:47

score 0 · Answer 4 · answered Dec 16 '22 at 08:04

0

You could try either one of the followings:

$('#checkbox_id').is(":checked"); // jQuery

document.getElementById("checkbox_id").checked //JavaScript

return true if checkbox is checked

answered Dec 16 '22 at 08:04

Du-Lacoste

11,530
2
71
51

Get checkbox selected state with JQuery

4 Answers4

Linked