Ensure all radio buttons have a value using jQuery

Question

I've got an annoyingly long list of radio button question / answers

Do you like A or B
Do you prefer x or y

Those type of questions.

Markup looks a little something like:

<input type="radio" name="User[AnnoyingQuestion][1]" value="1|Do you like x or y?|X" id="Member[PartyProfile]_1_0" />

<input type="radio" name="User[AnnoyingQuestion][1]" value="1|Do you like x or y?|Y" id="Member[PartyProfile]_1_1" class="elp-radio-question">

Basically, I need to ensure that all of the questions have been answered. What's a good strategy for doing this with jQuery?

Did any [answers](http://stackoverflow.com/a/10198160/144665) here help you? — iambriansreed, Jun 24 '12 at 07:24

iambriansreed · Accepted Answer · 2012-04-17T20:01:31.597

Proof: http://jsfiddle.net/iambriansreed/vXXUV/

Set the form selector to be more exact.

<script>

    $(function(){

        $('form').submit(function(e){

            var radios = {}, success = true;

            $('input[type="radio"]').each(function(){

                 var name = $(this).attr('name');

                 if(name in radios) return true;                 

                 radios[name] = $('input[name="'+name+'"]:checked').length > 0;

            });    

            for(name in radios){
                if(!radios[name]){
                    success = false;
                    alert('Please enter a value for '+name);
                }
            }

            if(!success) e.preventDefault();

            else alert('Form Submitting...');

        });        

    });

</script>

ahhh I fixed mine. I guess i should have fiddled it ): nice job ian +1 — Rooster, Apr 17 '12 at 20:06

score 1 · Answer 2 · edited May 23 '17 at 10:08

1

You should be able to use the jQuery validation plugin, as proposed in this question:

Validation of radio button group using jQuery validation plugin

Here are the validation plugin docs: http://docs.jquery.com/Plugins/Validation/Methods

edited May 23 '17 at 10:08

Community

1
1

answered Apr 17 '12 at 19:48

mltsy

6,598
3
38
51

Evan · Answer 3 · 2012-04-17T19:56:33.587

1

UPDATE. try this

function allChecked() {
    var $inputs = $('input[type="radio"]');

    $.each($inputs,function(){
        var $this = $(this),
        name = $this.attr('name');

        if ($('input[name="' + name +'"]:checked').length < 1){
            return false;
        }
    });

    return true;
}

this isn't incredibly efficient but i think it will work

edited Apr 17 '12 at 19:56

answered Apr 17 '12 at 19:49

Evan

5,975
8
34
63

-1 Only one radio of each name need to be selected. Your function needs them all to be selected. – iambriansreed Apr 17 '12 at 19:54
@iambriansreed yeah i realized that. fixed it – Evan Apr 17 '12 at 19:56

score 0 · Answer 4 · answered Apr 17 '12 at 20:01

Here's a quick way to do it assuming all your questions have just two options. Compare the number of checked radio buttons to the total number of radio button. If the number of checked boxes doesn't equal half the total, then something wasn't checked.

if( $('input[type=radio]:checked').length) == $('input[type=radio]').length/2) ...

Ensure all radio buttons have a value using jQuery

4 Answers4