CheckboxRadio

Make a checkbox act like a radio button.

HTML

<div class="pod" id="pod1">
    <input type="checkbox" name="pod1blam" id="pod1blam"/>
    <label for="pod1blam">Blam</label><br/>
    <input type="checkbox" name="pod1kapow" id="pod1kapow"/>
    <label for="pod1kapow">Kapow</label><br/>
    <input type="checkbox" name="pod1zowie" id="pod1zowie"/>
    <label for="pod1zowie">Zowie</label>
</div>

<div class="pod" id="pod2">
    <input type="checkbox" name="pod2blam" id="pod2blam"/>
    <label for="pod2blam">Blam</label><br/>
    <input type="checkbox" name="pod2kapow" id="pod2kapow"/>
    <label for="pod2kapow">Kapow</label>
</div>

CSS

div.pod
{
    border-color: grey;
    border-style: solid;
    border-width: 1px;
    float: left;
    height: auto;
    margin-left: 5px;
    margin-top: 5px;
    padding: 5px;
    width: auto;
}

JavaScript

$(document).ready(function()
{
    $(".pod > :checkbox").click(function()
    {
        powBlam(this);
    });
});


function powBlam(selectedCheckbox)
{
    var childNodesSelector;
    var parentNode = selectedCheckbox.parentNode;

    if (selectedCheckbox.checked == true)
    {
        childNodesSelector = "#" + parentNode.id + " > :checkbox";

        childNodes = $(childNodesSelector).each(function()
        {
            if (this.id != selectedCheckbox.id)
            {
                this.checked = false;
            }
        });
    }
}