Unselect Option from RadioGroup

[jvanderen1]

I wish there was a way to easily detect if the same option that was previously selected was selected again. In my use case, I would like to deselect this option.

Something like this:

    function onlyOne(checkbox) {
        var checkboxes = document.getElementsByName('check')
        checkboxes.forEach((item) => {
            if (item !== checkbox) item.checked = false
        })
    }

    <input type="checkbox" name="check" onclick="onlyOne(this)">
    <input type="checkbox" name="check" onclick="onlyOne(this)">
    <input type="checkbox" name="check" onclick="onlyOne(this)">
    <input type="checkbox" name="check" onclick="onlyOne(this)">

[RobinMalfait]

I'm a bit confused about your question. The RadioGroup component is a set of radio-like inputs, meaning that only one can be selected at a time, so I have a feeling that this already does what you want?

Is the only goal here to deselect the active one if you tap on that one (your question)? Or is the goal to only ever select one (your code snippet)?

[jvanderen1]

The goal is to deselect the active one if you click it.

If you run the code snippet yourself, that's actually what happens.

[SimplySayHi]

it would be really useful to have the checkbox version, like CheckboxGroup, so that:

• selected option can be deselected
• user can select multiple items

[ben519]

If you're desperate like I was, a reasonable hack is to create a radio group with an extra, hidden option that represents null or "no selection". If the user selects the already chosen option, manually change the selected value to that.