We Keep Coding

Two checkboxes acting as one

I have two checkboxes on a page and I want them to act as only one. For example, I select one, and the other is selected automatically, and vice-versa.
I've managed to select both of them at once, but I can't seem to figure out a way to deselect them at once.
And what's bothering me the most, is that it's probably a super simple line of code that I'm simply not remembering.
Is there a way to do this?

Is this what you're looking for?
$(".test").change(function () {
$(".test").attr("checked", this.checked);
});
<input type='checkbox' class='test'>A<br />
<input type='checkbox' class='test'>B<br />

Here is a solution in pure javascript:
// Select all checkboxes using `.checkbox` class
var checkboxes = document.querySelectorAll('.checkbox');
// Loop through the checkboxes list
checkboxes.forEach(function (checkbox) {
// Then, add `change` event on each checkbox
checkbox.addEventListener('change', function(event) {
// When the change event fire,
// Loop through the checkboxes list and update the value
checkboxes.forEach(function (checkbox) {
checkbox.checked = event.target.checked;
});
});
});
<label><input type="checkbox" class="checkbox"> Item 1</label>
<br>
<label><input type="checkbox" class="checkbox"> Item 2</label>

$(document).ready(function() {
$('#check_one').change(function() {
$('#check_two').prop('checked', $('#check_one').prop('checked'));
});
$('#check_two').change(function() {
$('#check_one').prop('checked', $('#check_two').prop('checked'));
});
});
<form>
<label>Simple checkbox</label>
<input type="checkbox" id="check_one" />
<label>Complicated checkbox</label>
<input type="checkbox" id="check_two" />
</form>
Assuming you have two checkboxes named differently but working in concert, this code would work

html:
<input type="checkbox" id="1" class="handleAsOne">
<input type="checkbox" id="2" class="handleAsOne">
javascript (jquery):
$('.handleAsOne').on('change'){
$('.handleAsOne').prop('checked', false);
$(this).prop('checked', true);
}
if i understood your question correctly you are looking for something like this.

Uncheck Checkbox using Javascript/JQuery

I have a simple Checkbox
<div>
<input type="checkbox" id="chkBox1" value="Test" /> Test
</div>
MVC 5 renders this html for this checkbox
<div class="checker" id="uniform-chkBox1">
<span class="checked">
<input type="checkbox" value="Test" id="chkBox1">
</span>
</div>
I want to uncheck this checkbox using Javascript/JQuery but I cannot figure it out. Using Firebug, when I remove the span class "checked" the checkbox gets unchecked but I cannot figure out how to do this in Javascript.

$('#chkBox1').prop('checked', true)
checks it off and
$('#chkBox1').prop('checked', false) turns if off.
Instead of prop(), you can also use attr()
If you instead want to just remove the class checked from the span element. you can do
$('#uniform-chkBox1 span.checked').removeClass('checked')

Use .prop().
In your case $("#chkBox1").prop("checked", false); will uncheck and $("#chkBox1").prop("checked", true); will check.
Run code below to see in action.
setInterval(function() {
if ($("#chkBox1").prop("checked"))
$("#chkBox1").prop("checked", false);
else
$("#chkBox1").prop("checked", true);
}, 1000);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="checkbox" value="Test" id="chkBox1" checked />

Get value checkbox javascript

i have an array of checkbox (to use with php), bu i want to use ajax to make somethings with this values from checkbox, i want to get the value from each checkbox and make an ajax request.
I have this:
$("#checked").each(function(i, val){
var k = $(i).value();
console.log(k);
});
but no success.
html:
<input id="checado" type="checkbox" name="ids[]" value="78">
<input id="checado" type="checkbox" name="ids[]" value="79">
<input id="checado" type="checkbox" name="ids[]" value="80">
<input id="checado" type="checkbox" name="ids[]" value="81">

With a small change to your HTML you can use the following JavaScript (demo):
<input class="checado" type="checkbox" name="ids[]" value="78"> 78<br/>
<input class="checado" type="checkbox" name="ids[]" value="79"> 79<br/>
<input class="checado" type="checkbox" name="ids[]" value="80"> 80<br/>
<input class="checado" type="checkbox" name="ids[]" value="81"> 81<br/>
<button id='Submit'>Submit</button>
<script>
$('#Submit').on('click', function() {
var values = []
$('.checado:checked').each(function () {
var e = $(this);
values.push(e.val());
});
alert(values);
});
</script>
For a more detailed breakdown of what is going on, the check boxes have a checked state and a value. the jQuery Selector $('.checado:checked') will return just the checked check boxes (You should use class when you have multiple elements and id only when you are identifying a single element, browsers and CSS can appear lazy about this but incorrect usage will yield unpredictable results). The other change is to grab the values by the jQuery method .val() which helps hide the input type and browser specific ways values are fetched.

You're using jQuery, which uses it's own .val() method. Replace .value() with .val().

Make first Radio button checked in Loop using name attribute

I have list of Radio buttons in loop like this:
<input type="radio" name="courses" id="course_1" value="1">
<input type="radio" name="courses" id="course_2" value="2">
<input type="radio" name="courses" id="course_3" value="3">
<input type="radio" name="courses" id="course_4" value="4">
I want to make first radio checked using name attribute not id.
Here is my Fiddle : http://jsfiddle.net/8AcYg/1/

Use .first()
$('input[name="courses"]').first().prop('checked', true)
Demo: Fiddle
You can also use :first, :eq(0) or .eq(0) to do the same

$("input[name='courses']:eq(0) ").attr("checked","checked");
or
$('input[name="courses"]:eq(0)').prop('checked', true);
demo
reference attribute-equals-selector , attr , prop

Do this by setting first child's attribute to true
$('input:radio[name=courses]:first-child').attr('checked',true);
See in jsfiddle

You can do it with native document method getElementsByName or querySelector
document.getElementsByName('courses')[0].checked = true;
or
document.querySelector('[name=courses]:first-child').checked = true;

CheckAll/UncheckAll checkbox with jQuery

I have made a check-box checkall/uncheckall.
HTML
<div> Using Check all function </div>
<div id="selectCheckBox">
<input type="checkbox" class="all" onchange="checkAll('selectCheckBox','all','check','true');" />Select All
<input type="checkbox" class="check" onchange="checkAll('selectCheckBox','all','check','false');" />Check Box 1
<input type="checkbox" class="check" onchange="checkAll('selectCheckBox','all','check','false');" />Check Box 2
<input type="checkbox" class="check" onchange="checkAll('selectCheckBox','all','check','false');" />Check Box 3
<input type="checkbox" class="check" onchange="checkAll('selectCheckBox','all','check','false');" />Check Box 4
</div>
main.js
function checkAll(parentId,allClass,checkboxClass,allChecked){
checkboxAll = $('#'+parentId+' .'+allClass);
otherCheckBox = $('#'+parentId+' .'+checkboxClass);
checkedCheckBox = otherCheckBox.filter($('input[type=checkbox]:checked'));
if(allChecked=='false'){
if(otherCheckBox.size()==checkedCheckBox.size()){
checkboxAll.attr('checked',true);
}else{
checkboxAll.attr('checked',false);
}
}else{
if(checkboxAll.attr('checked')){
otherCheckBox.attr('checked',true);
}else{
otherCheckBox.attr('checked',false);
}
}
}
It works fine. But get bulky when I have whole lot of checkboxes. I want to do same work by using jQuery rather than putting onchange on each checkbox. I tried different sort of things but couldnot work. I tried following one:
$('.check input[type="checkbox"]').change(function(e){
checkAll('selectCheckBox','all','check','true');
});
to do same work as onchange event but didnot work. Where do I went wrong.

I think you just need this: You do not need to pass all the arguments and have the inline onchange event attached to it. You can simplify your code.
$(function () {
$('input[type="checkbox"]').change(function (e) {
if(this.className == 'all')
{
$('.check').prop('checked', this.checked); //Toggle all checkboxes based on `.all` check box check status
}
else
{
$('.all').prop('checked', $('.check:checked').length == $('.check').length); // toggle all check box based on whether all others are checked or not.
}
});
});
Demo

Your selector is wrong:
.check input[type="checkbox"]
Above selects any input of type checkbox that has the ancestor with class .check. It'll match this:
<div class="check">
<input type="checkbox".../>
</div>
it should be:
input.check[type="checkbox"]

You closed the string here $('.check input[type='checkbox']') instead, you should use double quotes $('.check input[type="checkbox"]')