How to check if one of radio buttons was selected?

Question

I have JavaScript which checks for text fields and check boxes fine but when comes to radio buttons it fails to distinguish if one of the options was selected.

How to do this correctly?

This is what I have:

validateBugForm = function()
{
    var name = document.forms["bug_form"]["Name"].value;
    var email = document.forms["bug_form"]["Email"].value;
    var tos = document.forms["bug_form"]["Accept"].checked;
    var project = document.forms["bug_form"]["project"].value;

    if (name == "")
    {
        alert("You must provide your name or nick name!");
        return false;
    }

    if (project == "")
    {
        alert("You must choose a project.");
        return false;
    }

    if (email.indexOf ('@', 0) == -1 || email.indexOf ('.', 0) == -1)
    {
        alert("You must provide your email address!");
        return false;
    }

    if (!tos)
    {
        alert("You must agree to our Terms of Services.");
        return false;
    }
}

In my form I have:

<tr>
    <td width="30%">Choose a project in which you encountered a problem. 
    <big><font color="red">*</font></big></td></td>
    <td width="10px" class="table_td_space"></td>
    <td width="70%">
        <input type="radio" name="project" value="1" id="1">1<br>
        <input type="radio" name="project" value="2" id="2">2<br>
        <input type="radio" name="project" value="3" id="3">3<br>
        <input type="radio" name="project" value="4" id="4">4<br>
    </td>
</tr>

Answer 1

You need to loop through all of the radio button options to see if one was selected:

var projectObj = document.form1.project
var len = projectObj.length
var chosen = null;

for (i = 0; i <len; i++) {
    if (projectObj[i].checked) {
       chosen = projectObj[i].value
    }
}

if (chosen == null) {
    alert("No Radio Button Chosen")
}

http://homepage.ntlworld.com/kayseycarvey/jss3p11.html

Answer 2

Just a note, I spent an hour scratching my head over this one because this works fine unless you are trying to validate a form with more than this radio element. Since each radio button is a separate form element and you are trying to loop through all the elements in the form (eg., everything with "required_" in the name), this might mess up the rest of the validation or cause it to always come up "false" since you end up checking each radio button as a separate element as you loop through the form. The way around this I found is to use a hidden form field to hold the value of the selected radio button by putting an onClick event on each radio button to transfer it's value to the hidden field when clicked - and just check that there is a value in that hidden field. And don't flag the radio button as an element to be checked.

Answer 3

You need to loop through all of the radio button options to see if one was selected but when you holding the "projectObj" you have to call "value" method...

var projectObj = document.form1.project.value;
var len = projectObj.length;
var chosen = null;

for (i = 0; i <len; i++) {
    if (projectObj[i].checked) {
       chosen = projectObj[i].value;
    }
}

if (chosen == null) {enter code here
    alert("No Radio Button Chosen");
} 

then it will take value otherswise it just return radio object list