Here you can see that radio boxes only allow one option to be checked...

This example is pretty simple, I just put a bunch of radioboxes on a page and set the textbox's value to whatever was checked. I'm using this as an intro into doing more extensive work with various checks and options....

Here's the radiobox, calling my methods are in red

<TABLE BORDER BGCOLOR = CYAN WIDTH = 200>
<TR><TD><INPUT TYPE = RADIO NAME = RadioButtons onClick = radio1Clicked()>Radio 1</TD></TR>
<TR><TD><INPUT TYPE = RADIO NAME = RadioButtons onClick = radio2Clicked()>Radio 2</TD></TR>
<TR><TD><INPUT TYPE = RADIO NAME = RadioButtons onClick = radio3Clicked()>Radio 3</TD></TR>
<TR><TD><INPUT TYPE = RADIO NAME = RadioButtons onClick = radio4Clicked()>Radio 4</TD></TR>
<TR><TD><INPUT TYPE = RADIO NAME = RadioButtons onClick = radio5Clicked()>Radio 5</TD></TR>
</TABLE>

Here's the code...

function radio1Clicked()
{
document.form1.TextBox.value = "Radio button 1 was clicked."
}

function radio2Clicked()
{
document.form1.TextBox.value = "Radio button 2 was clicked."
}

function radio3Clicked()
{
document.form1.TextBox.value = "Radio button 3 was clicked."
}

function radio4Clicked()
{
document.form1.TextBox.value = "Radio button 4 was clicked."
}

function radio5Clicked()
{
document.form1.TextBox.value = "Radio button 5 was clicked."
}

Validating a form's inputs or a function's arguments

There really is no answer to the question, "How do I validate a form?", because when you say you're validating the form, you're really confirming the inputs to the form are formatted correctly for the form. Likewise, validating a function's arguments are valid for that function is simply confirming the inputs are correctly formatted.

I have long distrusted the <input type="Submit"> button. Often, this does not work out as we JavaScripters expect. On the other hand, JavaScript does provide a method for submitting a form. For instance, the form this page is using is called Tester. So, the line:

document.forms.Tester.submit()

works just fine for submitting this form. (Don't worry -- this form doesn't go anywhere.) In my professional opinion as a JavaScripter, it is simply easier to use a flag variable as an indicator of whether or not the form's inputs are valid, and then, if the flag is still valid, to submit the form.

Here's a group of inputs which demonstrate the example.

The source for this form is here:

<INPUT TYPE="text" NAME="line1" VALUE="Test" SIZE="15">
<INPUT TYPE="text" NAME="line2" VALUE="Form" SIZE="15">
<INPUT TYPE="button" VALUE="Validate and Submit!" onClick="validateTester()">

The validateTester() function is an ordinary button I use in place of the submit button. (In reality, the submit button is simply a button which submits the form, nothing more. So we can use an ordinary button instead.) The source for this function, and main focus of this page, I place here:

function validateTester() {
    var flag = true
    var Tester = document.forms.Tester
    if (Tester.line1.value!="JavaScript") {
        alert("First box must say 'JavaScript'!")
        flag = false
        }
    if (Tester.line2.value!="Kit") {
        alert("Second box must say 'Kit'!")
        flag = false
        }
    if (flag) {
        alert("Form is valid! Submitting form...")
        document.forms.Tester.submit()
        }
    }

Note the flag is initially set to true. The reason is we will only be checking certain conditions on the form -- and if those conditions pass, then the rest of the form's inputs are assumed valid (otherwise we'd validate them in the function!) and we can submit the form.

The first if statement checks to see if the line1.value is NOT "JavaScript". If it is NOT set to "JavaScript", the flag is set to false. Then, it doesn't matter what the other values are. With the flag set to false, the statement to submit the form is not executed.

If the second box is NOT "Kit", the flag is set to false. This function does not care what flag's current value is -- it simply sets flag to false at that step.

Finally, the call upon flag is made. If it is true, it will submit the form.

A little elementary logic will show you the decision tree.

It doesn't get much simpler than this. Incidentally, your flag variables do not have to be true or false values. Here's an example:

function radioval(obj) {
    var flag = -1
    for (var k = 0; k < obj.length; k++) {
        if (obj[k].checked) {
            flag = k
            }
        }
    return flag
    }

This sample function is one you can use to search radio button objects. It returns -1 if no radio button is checked, or the index number of the checked radio button.