I have a form with a checkbox. With jQuery I would like to set the value of the checkbox to TRUE if checked, and if it is not checked, the value will be set to FALSE. How I can do this please?
Add a comment |
6 Answers
You can do (jQuery 1.6 onwards):
$('#idCheckbox').prop('checked', true); $('#idCheckbox').prop('checked', false); to remove you can also use:
$('#idCheckbox').removeProp('checked'); with jQuery < 1.6 you must do
$('#idCheckbox').attr('checked', true); $('#idCheckbox').removeAttr('checked'); answered Nov 30, 2011 at 15:09
Nicola Peluchetti
76.9k32 gold badges150 silver badges197 bronze badges
1 Comment
IcedDante
But the checkbox value of false won't be submitted with a form submit, right? Is there a way to make that happen
UPDATED: Using prop instead of attr
<input type="checkbox" name="vehicle" id="vehicleChkBox" value="FALSE"/> $('#vehicleChkBox').change(function(){ cb = $(this); cb.val(cb.prop('checked')); }); OUT OF DATE:
Here is the jsfiddle
<input type="checkbox" name="vehicle" id="vehicleChkBox" value="FALSE" /> $('#vehicleChkBox').change(function(){ if($(this).attr('checked')){ $(this).val('TRUE'); }else{ $(this).val('FALSE'); } }); 2 Comments
vol7ron
Old post, but you should now use
.prop('checked') instead of attr(). Additionally it's easier to force it in one line var $cb=$(this); $cb.val( $cb.prop('checked')); or if case is important var $cb=$(this); $cb.val( ($cb.prop('checked')+'').toUpperCase() );
Ommadawn
And how to 'uncheck'?
Use $('#id-of-the-checkbox').prop('checked', true_or_false);
In case you are using an ancient jQuery version, you'll need to use .attr('checked', 'checked') to check and .removeAttr('checked') to uncheck.
Comments
Try this:
HTML:
<input type="checkbox" value="FALSE" /> jQ:
$("input[type='checkbox']").on('change', function(){ $(this).val(this.checked ? "TRUE" : "FALSE"); }) Please bear in mind that unchecked checkbox will not be submitted in regular form, and you should use hidden filed in order to do it.
1 Comment
Krule
Well,
span in snippet is for demonstration purposes only and if you take a look at the code, it will be set to be equal to value of checkbox. However, if you need a better (bit faster) solution, this might help: jsfiddle.net/SfEGn/130var checkbox = $( "#checkbox" ); checkbox.val( checkbox[0].checked ? "true" : "false" ); This will set the value of the checkbox to "true" or "false" (value property is a string), depending whether it's unchecked or checked.
Works in jQuery >= 1.0
1 Comment
Coded Container
This is only for the default state of the checkbox. You would need to add an event watcher on the element when the state of the checkbox changed.
<input type="checkbox" name="vehicle" id="vehicleChkBox" value="FALSE"/> --
$('#vehicleChkBox').change(function(){ if(this.checked) $('#vehicleChkBox').val('TRUE'); else $('#vehicleChkBox').val('False'); }); 
1 Comment
sica07
Please explain your code so that future readers may benefit from it. Thank you