Deselect Radio Button

Question

Wondering how I can deselect a Radio Button. I have a grid of 10 rows, 3 columns. Only allowed 1 selection per row. Responses not required for every row. Currently using radio buttons rather than checkbox because I prefer having 10 vars rather than 30 (e.g. r1_c1, r1_c2, etc.) . If the respondent clicks on a row by mistake and wants to remove that selection, they are unable to do so with Radio Buttons. Was hoping to use a double-click function to deselect the Radio Button. Found some code online but have not been able to have it take effect. Any help would be appreciated.

$('.rdCheck').dblclick(function(){
    if($(this).is(':checked'))
    {
        $(this).removeAttr('checked');
    }
});

Thanks!

Answer 1

One solution that I have seen others use is to allow respondents to clear a radio response by clicking on the selected item again.  You may need to explain to respondents that this functionality exists as it is not a standard of radio buttons across the web.

If this option sounds good, this is the script I have used in the past:

<script>
$(document).ready(function(){
    var resps = {};
    $('input[type="radio"]').each(function(){
        var name = $(this).attr('name');
        resps[name] = SSI_GetValue(name);
    });
    
    SSI_CustomGraphicalRadiobox = function(graphical, input) {
        var name = input.name;
        var resp = SSI_GetValue(name);
        if (resp == resps[name]) {
            SSI_RadioReset(name);
            resp = 0;
        }
        resps[name] = resp;
    };
})
</script>

Comments

This is perfect! Thank you!