CODEWITHSUNDEEP
javascriptjquery
Michael
Michael

Reputation: 2187

Check if a radio selection is made

I am having trouble checking whether there is a radio selection is not made in my form. In my form, I have 5 items, each item is given 2 options (radio buttons). Something like this:

item 1    opt1   opt2   (name attribute is "1")
item 2    opt1   opt2   (name attribute is "2")
item 3    opt1   opt2
item 4    opt1   opt2
item 5    opt1   opt2

I have given all input radio buttons the same class name as items are generated dynamically, so are the name attribute of the input. Here is my code of check each item:

$(document).ready(
    function(){
        $('#submit').click(function(){
                var buttons = document.getElementsByClassName('radio_class');
                var radio_num = buttons.length; //which returns 10 in this case
                var error = "";
                for (var i=0; i<radio_num; i=i+2){
                    var radio_name = buttons[i].getAttribute("name");
                    if (!$("input[@name=radio_name]:checked").val()) {
                        error += radio_name + " ";
                    }
                }
                if (error !== "") {
                    alert (error+"not checked!");
                    return false;
                }
                else {
                    alert ("All the items have been checked.")
                }
            }
        );
    }
);

If all the five items are not checked, it alerts the correct message that is "1 2 3 4 5 not checked", however, if I just check one item, the message "All the items have been checked." will be alerted. Can anyone help me with this? Thanks.

Upvotes: 0

Views: 140

Answers (3)

Jayme Tosi Neto
Jayme Tosi Neto

Reputation: 1239

I think this may solve your problem:

$(document).ready(function(){
    $('#submit').click(function(){
            var buttons = $('.radio_class');
            var radio_num = buttons.length;
            var error = "";
            $.each(buttons, function(index, val){
                var radio_name = $(this).attr("name");
                if( !$('[name="'+radio_name+'"]:checked').val() )
                    error += radio_name + " ";
            });

            if (error !== "")
            {
                alert (error+"not checked!");
                return false;
            }
            else {
                alert ("All the items have been checked.")
            }
        });
});

;)

Upvotes: 1

adeneo
adeneo

Reputation: 318182

$(document).ready(function(){
    $('#submit').click(function(){
        var error = "";
        $('.radio_class').each(function() {
            if (!$(this).is(':checked')) {
                error += $(this).attr('name') + " ";
            }
        });
        if (error != "") {
            alert (error+"not checked!");
            return false;
        }else {
            alert ("All the items have been checked.")
        }
   });
});​

FIDDLE

Upvotes: 0

Fabrizio Calderan
Fabrizio Calderan

Reputation: 123377

where you wrote

if (!$("input[@name=radio_name]:checked").val()) {
    error += radio_name + " ";
}

try instead

if (!$("input[name='"+radio_name+"']:checked").val()) {
    error += radio_name + " ";
}

Upvotes: 2

Related Questions