I'd like to loop through multiple (dynamic) radio button groups using jQuery, and if any haven't had a selection made, it throws up an error and stops the form submission.
Here's my effort so far:
$("form").submit(function() {
$(":radio").each(function(){
if($(this).val().length == 0) {
alert('Not selected all radios');
return false;
}
});
});
But it always ignores the if statement which will stop the submission, as if maybe $(this) isn't actually the value of the radio buttons?
Here's a jsFiddle: http://jsfiddle.net/aVVW9/
Any help would be much appreciated, thank you!
Try this. The approach is to loop through ALL radio buttons, and THEN extract the name of the radio button group, using :checked to see if any member of that group is checked. A simple Boolean stops the errors after the first missing check is found.
$("form").submit(function() {
var submitme = true;
$(':radio').each(function() { // loop through each radio button
nam = $(this).attr('name'); // get the name of its set
if (submitme && !$(':radio[name="'+nam+'"]:checked').length) {
// see if any button in the set is checked
alert(nam+' group not checked');
submitme = false;
}
});
return submitme; // cancel the form submit
});