Question

i need to make “groups” or something with my checkboxes. i want to click on a checkbox and only those checkboxes are active which available then. Like in the car configuration. If you buy the electric mirror you cant chose the manual one.In my case i have Product 1A 1B 1C and 2A 2B 2C and if i chose product one i can only choose product 1A,1B,1C.

<input type="checkbox" value="">1A</label>
<input type="checkbox" value="">1B</label>
<input type="checkbox" value="">1C</label>
<input type="checkbox" value="">2A</label>
<input type="checkbox" value="">2B</label>
<input type="checkbox" value="">2C</label>

Answer 1

HTML

<input type="checkbox" class='product' value=""/>1A
<input type="checkbox" class='product' value=""/>1B
<input type="checkbox" class='product' value=""/>1C
<input type="checkbox" class='product' value=""/>2A
<input type="checkbox" class='product' value=""/>2B
<input type="checkbox"class='product'  value=""/>2C

jQuery

$(function(){
 var $product = $('input.product');
$product.click(function() {
    $product.filter(':checked').not(this).removeAttr('checked');
});

})

FIDDLE

Added after comment from OP

This is the code after the comment that if i chose 1A, i can also click on 1B and 1C but not on 2A,2B,2C*

HTML

<input type="checkbox" class='one' value=""/>1A
<input type="checkbox" class='one' value=""/>1B
<input type="checkbox" class='one' value=""/>1C<br/>
<input type="checkbox" class='two' value=""/>2A
<input type="checkbox" class='two' value=""/>2B
<input type="checkbox" class='two'  value=""/>2C

jQuery

$(function(){
 var $one= $('input.one');
$one.click(function() {
    $one.filter(':checked').not(this).removeAttr('checked');
    if($one.filter(':checked').length>0) {
       $two.attr("disabled","disabled");
    }
    else {
        $two.removeAttr("disabled");
    }
});

var $two= $('input.two');
$two.click(function() {
    $two.filter(':checked').not(this).removeAttr('checked');
    if($two.filter(':checked').length>0) {
       $one.attr("disabled","disabled");
    }
    else {
        $one.removeAttr("disabled");
    }
});

});

Fiddle