Determine if every radio group has had an option selected

Question

I need to make sure that all the radio groups have been answered before I enable the submit button. If I have:

var radioBtns = $(\'input\').filter(\':radio\         


        

Answer 1

To get the count of radio button groups:

var prevGroupName = "", currGroupName = "", groupCount = 0;
    $("input[type='radio']").each(function () {

        if (prevGroupName == "") {
            groupCount++;
            prevGroupName = this.name;
        }

        currGroupName = this.name;

        if (prevGroupName != currGroupName) {
            groupCount++;
            prevGroupName = currGroupName;
        }
    });

To get the number of checked radio button:

var radioChecked = $("input[type='radio']:checked").length;

Answer 2

If you know how many groups you have you can just do:

if($('input:radio:checked').length < numGroups){
    // At least one group isn't checked
}

Otherwise you need to count the number of groups first. I can't think of any way to do this better then:

var rgroups = [];
$('input:radio').each(function(index, el){
        var i;
        for(i = 0; i < rgroups.length; i++)
            if(rgroups[i] == $(el).attr('name'))
                return true;
        rgroups.push($(el).attr('name'));
    }
);
rgroups = rgroups.length;

if($('input:radio:checked').length < rgroups)
    alert('You must fill in all the fields.');
else
    alert('Thanks!');

Answer 3

Based on answers here, here and here. Checks against a class and permits multiple items from same group to be selected.

function check_all_groups () {
    var counter = 0
    $('.btn-group').each(function () {
        $(this).children('.atleastone').each(function () {
            if ($(this).hasClass('active')) {
                counter += 1
                return false
            }
        });
    });

    if (counter == $('.btn-group').length) {
        return true
    }
};

Answer 4

I have theoretical* solution building off Paulpro's answer above that uses the uniqueness property of Set to filter a list of element names from JQuery:

var radioNames = new Set(Array.from($('input:radio').map(function() { return this.name } )));
var inputGroupCount = radioNames.length;

if( $('input:radio:checked').length < inputGroupCount){
    // At least one group isn't checked
}

This uses the map() function to extract the name attributes from the radio groups. This is then converted to an Array, which is used as the constructor argument for Set.

Unfortunately, as of April 2016 there is no support for Set(iterable) and Array.from() in IE; Opera and Safari have limited support.

If you can ensure your users are on Chrome or Firefox, or this is backend code, then go ahead!

Answer 5

not very neat way but still you can use it

$("input:button").click(function(){
    var v =$('input[name="a"]').filter(':checked');
    var vr =$('input[name="b"]').filter(':checked');
    if(v.length==0)
    {
    alert("select a group");

    }else alert("very good");


    if(vr.length==0)
    {
    alert(" o come on ");

    }else alert("guud");

    });

FIDDLE

Answer 6

This works:

var all_answered = true;
$(':radio').each(function(){
    if($(':radio[name='+$(this).attr('name')+']:checked').length == 0)
    {
        all_answered = false;
    }
});
alert(all_answered);

Working demo: http://jsfiddle.net/AlienWebguy/8Cu6d/1/