Avatar of Daryl Isaacs
Daryl Isaacs

asked on 

Select only one checkbox in a group

I have a series of checkboxes to use instead of radios (radios are not available to the system).

I cobbled together this jquery to enable a psudeo effect, however its a little dodgy, and I'm no jquery expert.

This uses an initial checkbox to query against and what I did was hide it using css. There has to be a more eloquent way of doing this, without the need of the first checkbox.

here is the code
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script>
$(document).ready(function () {
$('.compbox :checkbox').not(".hidebox").click(function () {
   var exclude = "";
 $('.compbox :checkbox').not($(this).add(exclude)).removeAttr('checked');
});
});
</script>
<style>
.hidebox {display:none;}
.compbox {display:inline-block;}
</style>


<div class="compbox">
    <input type="checkbox" class="hidebox" />
    <input type="checkbox" class="compbox" /> AAA 
    <input type="checkbox" class="compbox" /> BBB
    <input type="checkbox" class="compbox" /> CCC
    <input type="checkbox" class="compbox" /> DDD
    <input type="checkbox" class="compbox" /> EEE
    <input type="checkbox" class="compbox" /> FFF
</div>

Open in new window

Ideally I would like this to not be reliant upon the first checkbox and work without the need for an extra hidden one.

Possible?
JavaScriptPHPHTML

Avatar of undefined
Last Comment
Daryl Isaacs

8/22/2022 - Mon