I have a html with a checkbox and 3 radio buttons. I want to disable and deselect all radio buttons when the checkbox is unchecked, and select the first radio button when checkbox is checked. I have the below code but it does not seem to be working.

//html
<input type="checkbox" id="test_duration_checkbox" /> Timed Test
<input type="radio" value="30" name="test_duration" /> 30 Mins
<input type="radio" value="60" name="test_duration" /> 60 Mins
<input type="radio" value="180" name="test_duration" /> Full test (3 hrs)

//jquery
$('#test_duration_checkbox').change(function() {
    if($(this).is(':checked'))
    {
        $('input[name=test_duration]').removeAttr('disabled');
        $('input[name=test_duration]:first').attr('checked', true);
    }
    else
    {
        $('input[name=test_duration]:checked').removeAttr('checked');
        $('input[name=test_duration]').attr('disabled', 'disabled');
    }
});

I am using jQuery 1.9(latest)

Member Avatar
LastMitch

@rajesh1158

I want to disable and deselect all radio buttons when the checkbox is unchecked, and select the first radio button when checkbox is checked.

You can try this:

$('#test_duration_checkbox').find('input[type=checkbox]:checked').removeAttr('checked');