Develop Reference

Binding Checkbox based on the value of the field in AngularJS

I want to check/uncheck checkbox based on the value of the field services.Register.IsTest.
When services.Register.IsTest=True
My checkbox should be checked else not
my checkbox
<input type="checkbox" id="patReturned" value="Returned">
I am new to AngularJS. Please help.
Thanks

Your are looking for the ngChecked directive from AngularJS
Sets the checked attribute on the element, if the expression inside ngChecked is truthy.
Use it like this
<input type="checkbox" id="patReturned" value="Returned" ng-checked="services.Register.IsTest">

Try this
<input type="checkbox" ng-checked="services.Register.IsTest == true" ng-model="services.Register.IsTest" ng-true-value="true" ng-false-value="false">

Just add ng-model directive if you need two-way binding (i.e. services.Register.IsTest will be updated when the checkbox is checked or unchecked):
<input type="checkbox" id="patReturned" value="Returned" ng-model="services.Register.IsTest">
Make sure services.Register.IsTest is a part of the relevant scope.
Besides that, you can use ng-checked directive to avoid changing services.Register.IsTest:
<input type="checkbox" id="patReturned" value="Returned" ng-checked="services.Register.IsTest">

issue in checkbox of angular js

<div ng-repeat="n in mysize"
<input type="checkbox" id="ckl_{{n.id}}" ng-model="n[id].checked"
ng-change="selectSizeEdit(p.size_arr,n.id)" ng-if="(p.size_arr.indexOf(n.id) > -1)" ng-checked="true">
</div>
In the above code the values inside p.size_arr in checkboxes will be checked. Bt i cant select new checkboxes other than in p.size_arr. Plz help me.

ng-model="n[id].checked" is probably wrong, could you try ng-model="n.checked"?

Checkbox value true/false

I have a form with checkbox and I want to keep it checked after submitting the form when it goes back to the same view with an error. I heard that the value attribute can help me to make the checkbox be checked so im trying to set it to true/false. Anyway, the input value stays "false" even if I click it. What happens exactly?
I thought the value goes true/false after clicking the checkbox
<input type="checkbox" name="acceptRules" class="inline checkbox" id="checkbox1" value="false">
<script>
$("#checkbox1").is(':checked', function(){
$("#checkbox1").attr('value', 'true');
});
</script>

If I understand the question, you want to change the value of the checkbox depending if it is checked or not.
Here is one solution:
$('#checkbox-value').text($('#checkbox1').val());
$("#checkbox1").on('change', function() {
if ($(this).is(':checked')) {
$(this).attr('value', 'true');
} else {
$(this).attr('value', 'false');
}
$('#checkbox-value').text($('#checkbox1').val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="checkbox" name="acceptRules" class="inline checkbox" id="checkbox1" value="false">
<div id="checkbox-value"></div>

Use Checked = true
$("#checkbox1").prop('checked', true);
Note: I am not clear whether you want to onclick/onchange event on checkbox. is(":checked", function(){}) is a wrong in the question.

To return true or false depending on whether a checkbox is checked or not, I use this in JQuery
let checkState = $("#checkboxId").is(":checked") ? "true" : "false";

Try this
$("#checkbox1").is(':checked', function(){
$("#checkbox1").prop('checked', true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="acceptRules" class="inline checkbox" id="checkbox1" value="false">

Checkboxes can be really weird in JS. You're best off checking for the presence of the checked attribute. (I've had older jQuery versions return true even if checked is set to 'false'.) Once you've determined that something is checked then you can get the value from the value attribute.

jQuery.is() function does not have a signature for .is('selector', function).
I guess you want to do something like this:
if($("#checkbox1").is(':checked')){
$("#checkbox1").attr('value', 'true');
}

I'm going to post this answer under the following assumptions.
1) You (un)selected the checkbox on the first page and submitted the form.
2) Your building the second form and you setting the value="" true/false depending on if the previous one was checked.
3) You want the checkbox to reflect if it was checked or not before.
If this is the case then you can do something like:
var $checkbox1 = $('#checkbox1');
$checkbox1.prop('checked', $checkbox1.val() === 'true');

Or you can solve this with only JavaScript by using onClick:
<input type="checkbox" name="acceptRules" class="inline checkbox" id="checkbox1" value="false" onClick={e => console.log(e.target.checked)}>

Good practise to use this:
$('.name-checkbox:checked').length

Two Checkboxes Being Checked at the Same Time

I have two checkboxes. What I need is when someone checks one of the boxes, it will automatically check the other one as well. And vice versa, if someone unchecks one of the boxes, it unchecks both. This is a bundle package on the form and they can not get one without the other.
<input type="checkbox" id="chk1" name="chk1" value="100">Voicemail<br />
<input type="checkbox" id="chk2" name="chk2" value="50">VM Support
Any help is greatly appreciated!

Why not this?
<input type="checkbox" id="chk1" name="chk1" value="100">
<label for="chk1">Voicemail and VM Support</label>

Assuming you want to only test these two checkboxes (and not every one on the page), you can use a jQuery Multiple Selector to access the onClick event for both. Using this you can test the checked status of the checkbox that was just clicked, and then assign that status of both checkboxes to match the one that was just clicked.
$('#chk1, #chk2').on('click', function(){
var checked = $(this).is(':checked');
$('#chk1, #chk2').attr('checked', checked);
});

Try this
$('#chk1 , #chk2').on('click', function(){
$('#chk1 , #chk2').attr('checked', $(this).is(':checked'))
});
FIDDLE
FIDDLE

Why does my checkbox return the wrong state?

I'm really confused. I have the following html in a form:
<input class="check-box"
id="Data__Correct"
name="Data.Correct"
type="checkbox" value="Data.Correct" />
This creates the following on the web page
<input class="check-box"
id="Data__Correct"
name="Data.Correct"
type="checkbox" value="False" />
When I put a check in the checkbox, submit the form, and check with fiddler I see it's sending:
Data.Correct False
I thought it should be the other way around. What's happening?

You are misunderstanding how checkbox works. If the checkbox is unchecked then no value is passed to the backend. If the checkbox IS checked then the value in the value attribute is passed to the backend. In your case, you set value to False, so you are getting the string False not to be confused with the boolean value false.
If your intent with value='False' is to set the state of the checkbox on load, then you instead need to do this:
<input type="checkbox" ... checked/>
Or checked="checked" should also work I believe. If checked is present then the box is checked, otherwise it is unchecked.