Skip to content Skip to sidebar Skip to footer

Only One Checkbox Checked At A Time In Javascript

I have 3 checkbox, for which I want only 1 checkbox to be checked at a time. below is my fiddle for the html JS fiddle I want this to be worked in IE8 also kindly suggest how to do

Solution 1:

How about this - fiddle:

<inputtype="checkbox"class="chk" />
<inputtype="checkbox"class="chk" />
<inputtype="checkbox"class="chk" />
<inputtype="checkbox"class="chk" />

$('input.chk').on('change', function() {
    $('input.chk').not(this).prop('checked', false);  
});

Edit: for second part of your question to un-check other checkboxes when selecting parent checkbox see this fiddle - (as per chat) :

if (!cb.checked) { 
$('#trchkOptions input[type=checkbox]').attr('checked', false); 
}

Solution 2:

functionselectOnlyThis(id) {
    for (var i = 1;i <= 4; i++)
    {
        document.getElementById(i).checked = false;
    }
    document.getElementById(id).checked = true;
}
<inputtype="checkbox"id="1"value="Value1"onclick="selectOnlyThis(this.id)" /> Option 1
<inputtype="checkbox"id="2"value="Value1"onclick="selectOnlyThis(this.id)" /> Option 2
<inputtype="checkbox"id="3"value="Value1"onclick="selectOnlyThis(this.id)" /> Option 3
<inputtype="checkbox"id="4"value="Value1"onclick="selectOnlyThis(this.id)" /> Option 4

It should help you

Post a Comment for "Only One Checkbox Checked At A Time In Javascript"