598

If the checkbox is checked, then I only need to get the value as 1; otherwise, I need to get it as 0. How do I do this using jQuery?

$("#ans").val() will always give me one right in this case:

<input type="checkbox" id="ans" value="1" />
3
  • 2
    .val() is to get the value attribute, not the check status. The value attribute can be anything, it doesn't need to be boolean. Nov 16, 2016 at 4:07
  • if you're still around, you may want to update the accepted answer for modern software... a lot of people still see this question
    – xaxxon
    Mar 25, 2018 at 3:55
  • Possible duplicate of How to check whether a checkbox is checked in jQuery?
    – Laurent S.
    Feb 14, 2019 at 15:30

21 Answers 21

1013

Use .is(':checked') to determine whether or not it's checked, and then set your value accordingly.

More information here.

2
  • 1
    In addition, when you do $("#id").is("checked") in a if clause you'll get true or false, not on/off, by return and you can send it to your back-end script and do whatever you want.
    – Zanoldor
    Feb 15, 2017 at 12:33
  • 1
    Probably this doesn't matter nowadays: ReSharper (I guess) outputs a warning "The pseudo-class 'checked' is not compatible with Internet Explorer 8.0".
    – Uwe Keim
    Feb 27, 2017 at 22:31
213
$("#ans").attr('checked') 

will tell you if it's checked. You can also use a second parameter true/false to check/uncheck the checkbox.

$("#ans").attr('checked', true);

Per comment, use prop instead of attr when available. E.g:

$("#ans").prop('checked')
0
90

Just use $(selector).is(':checked')

It returns a boolean value.

57
// use ternary operators
$("#ans").is(':checked') ? 1 : 0;
1
  • @Loic to set his value using the terse ternary syntax, eg: : a = ischecked ? 1 : 0
    – user1135300
    Jul 29, 2016 at 12:32
24

@StefanBrinkmann's answer is excellent, but incomplete for beginners (omits the variable assignment). Just to clarify:

// this structure is called a ternary operator
var cbAns = ( $("#ans").is(':checked') ) ? 1 : 0;

It works like this:

 var myVar = ( if test goes here ) ? 'ans if yes' : 'ans if no' ;

Example:

var myMath = ( 1 > 2 ) ? 'yes' : 'no' ;
alert( myMath );

Alerts 'no'

18

You can try this:

$('#studentTypeCheck').is(":checked");
15

I've found the same problem before, hope this solution can help you. first, add a custom attribute to your checkboxes:

<input type="checkbox" id="ans" value="1" data-unchecked="0" />

write a jQuery extension to get value:

$.fn.realVal = function(){
    var $obj = $(this);
    var val = $obj.val();
    var type = $obj.attr('type');
    if (type && type==='checkbox') {
        var un_val = $obj.attr('data-unchecked');
        if (typeof un_val==='undefined') un_val = '';
        return $obj.prop('checked') ? val : un_val;
    } else {
        return val;
    }
};

use code to get check-box value:

$('#ans').realVal();

you can test here

4
  • 10
    ...because jQuery is known as "the write more do less" library Nov 13, 2013 at 11:24
  • long story you have gone to far JQUERY want developer to write less and do extra more. simple problem deserve simple solution
    – ShapCyber
    Jul 1, 2015 at 21:07
  • yes, agreed, write less, do more. you write the extension once, and for the rest of time, you only call the API $(someradio).realVal(), you don't need write a extension many times.
    – alphakevin
    Jun 12, 2016 at 9:08
  • You didn't even need to write the extension once, nevermind 'many times'! O.o
    – Coz
    May 3, 2017 at 15:38
8
$('input:checkbox:checked').val();        // get the value from a checked checkbox
0
8
<input type="checkbox" id="ans" value="1" />

Jquery : var test= $("#ans").is(':checked') and it return true or false.

In your function:

$test =($request->get ( 'test' )== "true")? '1' : '0';
6

You can also use:

$("#ans:checked").length == 1;
4

Use:

$("#ans option:selected").val()
2
  • if it's not selected, then the first part wouldn't return anything, right?
    – xaxxon
    Jan 27, 2011 at 6:06
  • @Senthil, OP is not asking to get the value of a selected checkbox, rather return 1 if it is selected
    – Om Shankar
    Jul 29, 2012 at 15:51
4
function chkb(bool){
if(bool)
return 1;
return 0;
}

var statusNum=chkb($("#ans").is(':checked'));

statusNum will equal 1 if the checkbox is checked, and 0 if it is not.

EDIT: You could add the DOM to the function as well.

function chkb(el){
if(el.is(':checked'))
return 1;
return 0;
}

var statusNum=chkb($("#ans"));
4

I've came through a case recently where I've needed check value of checkbox when user clicked on button. The only proper way to do so is to use prop() attribute.

var ansValue = $("#ans").prop('checked') ? $("#ans").val() : 0;

this worked in my case maybe someone will need it.

When I've tried .attr(':checked') it returned checked but I wanted boolean value and .val() returned value of attribute value.

4

There are Several options are there like....

 1. $("#ans").is(':checked') 
 2. $("#ans:checked")
 3. $('input:checkbox:checked'); 

If all these option return true then you can set value accourdingly.

1
  • The first one should be (':checked'), doesn't work otherwise. Oct 5, 2016 at 11:18
2

Try this

$('input:checkbox:checked').click(function(){
    var val=(this).val(); // it will get value from checked checkbox;
})

Here flag is true if checked otherwise false

var flag=$('#ans').attr('checked');

Again this will make cheked

$('#ans').attr('checked',true);
2
 $("#id").prop('checked') === true ? 1 : 0;
0

You can get value (true/false) by these two method

$("input[type='checkbox']").prop("checked");
$("input[type='checkbox']").is(":checked");
0

First check the value is checked

$("#ans").find("checkbox").each(function(){
    if ($(this).prop('checked')==true){ 
    var id = $(this).val()
    }
});

Else set the 0 value

0

If you want integer value of checked or not, try:

$("#ans:checked").length
0

You can perform it, this way:

$('input[id=ans]').is(':checked');     
0

I found the following worked for me, with a mix of one of the answers, but with if statement.

$('#checkbox').on('change', function () {
 let checkbox_true;
  checkbox_true = $('#checkbox').prop("checked") ? 1 : 0 ;
   if (checkbox_true === 1) {
     alert('Yes');
   } else {
     alert('no');
   }
})

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.