Only one checkbox checked at a time in javascript

Question

I have 3 checkbox, for which I want only 1 checkbox to be checked at a time. below is my fiddle for the html

I want this to be worked in IE8 also kindly suggest how to do

"I want only 1 checkbox to be checked at a time", if you want that then why not use radio buttons which have that functionality built in — Patrick Evans
– Patrick Evans, Commented May 3, 2016 at 11:17
@PatrickEvans: I know it has inbuilt functionality of that,. But the client requirements is on the basis of checkbox :( — HEEN
– HEEN, Commented May 3, 2016 at 11:19
You can take a look at this post: stackoverflow.com/questions/15548041/…. — Martin Parenteau
– Martin Parenteau, Commented May 3, 2016 at 11:55
@ConnorsFan: same issue, not working. I am able to check all the checkboxes — HEEN
– HEEN, Commented May 3, 2016 at 12:10

Zaki · Accepted Answer · 2016-05-04 10:36:02Z

11

How about this - fiddle:

<input type="checkbox" class="chk" />
<input type="checkbox" class="chk" />
<input type="checkbox" class="chk" />
<input type="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); 
}

edited May 4, 2016 at 10:36

answered May 3, 2016 at 11:22

Zaki

5,6087 gold badges58 silver badges91 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Zaki Over a year ago

You need Jquery included also make sure your checkboxes are not asp.net as it will change the ID, if it is set it to static. see fiddle, if pure Javascript then see Gokul's answer

Zaki Over a year ago

if you click on it will tell you where the error is you must have included something like extra >

HEEN Over a year ago

Let us continue this discussion in chat.

Zaki Over a year ago

hi check chat room

HEEN Over a year ago

Thanku so much Zaki.!!

Gokul Shinde · Accepted Answer · 2016-05-03 11:22:50Z

2

function selectOnlyThis(id) {
    for (var i = 1;i <= 4; i++)
    {
        document.getElementById(i).checked = false;
    }
    document.getElementById(id).checked = true;
}

<input type="checkbox" id="1" value="Value1" onclick="selectOnlyThis(this.id)" /> Option 1
<input type="checkbox" id="2" value="Value1" onclick="selectOnlyThis(this.id)" /> Option 2
<input type="checkbox" id="3" value="Value1" onclick="selectOnlyThis(this.id)" /> Option 3
<input type="checkbox" id="4" value="Value1" onclick="selectOnlyThis(this.id)" /> Option 4

It should help you

answered May 3, 2016 at 11:22

Gokul Shinde

9753 gold badges10 silver badges30 bronze badges

1 Comment

HEEN Over a year ago

I get error as Microsoft JScript runtime error: 'document.getElementById(...)' is null or not an object

Collectives™ on Stack Overflow

Only one checkbox checked at a time in javascript

2 Answers 2

5 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related