How To Uncheck Checkbox When Radio Button Is Checked And Uncheck Radio Button When Checkboxes Are Checked Using Javascript

Male
Female

Solution 1:

I hope this is what you were looking for:

HTML:

<div id="a">
  <input type="radio" name="sex" value="male">Male<br>
  <input type="radio" name="sex" value="female">Female
</div>

<div id="b">
  <input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
  <input type="checkbox" name="vehicle" value="Car">I have a car 
</div>

JS:

$('input[type="radio"]').change(function() {
    if ($(this).is(':checked')){ //radio is now checked
        $('input[type="checkbox"]').prop('checked', false); //unchecks all checkboxes
    }
});

$('input[type="checkbox"]').change(function() {
    if ($(this).is(':checked')){
        $('input[type="radio"]').prop('checked', false);
    }
});

Fiddle:

http://jsfiddle.net/24kg2/

Share