Q1006 How can I check a radio option based on the selection of a select form field?

You are here: irt.org | FAQ | JavaScript | Form | 10.1 | Q1006 [ previous next ]

The following demonstrates two ways of checking a radio button, one using the index number of like named radio buttons, the other way using the name of differently named radio buttons:

<SCRIPT LANGUAGE="JavaScript"><!--
function changed() {
    document.myForm.sameName[document.myForm.mySelect.selectedIndex].checked = true;
    document.myForm.elements[document.myForm.mySelect.options[document.myForm.mySelect.selectedIndex].text].checked = true;
}
//--></SCRIPT>

<FORM NAME="myForm">
<SELECT NAME="mySelect" onChange="changed()">
<OPTION>Red
<OPTION>Orange
<OPTION>Yellow
<OPTION>Green
<OPTION>Blue
<OPTION>Indigo
<OPTION>Violet
</SELECT>

<BR><INPUT TYPE="radio" NAME="sameName"> Red
<BR><INPUT TYPE="radio" NAME="sameName"> Orange
<BR><INPUT TYPE="radio" NAME="sameName"> Yellow
<BR><INPUT TYPE="radio" NAME="sameName"> Green
<BR><INPUT TYPE="radio" NAME="sameName"> Blue
<BR><INPUT TYPE="radio" NAME="sameName"> Indigo
<BR><INPUT TYPE="radio" NAME="sameName"> Violet

<P>

<BR><INPUT TYPE="radio" NAME="Red"> Red
<BR><INPUT TYPE="radio" NAME="Orange"> Orange
<BR><INPUT TYPE="radio" NAME="Yellow"> Yellow
<BR><INPUT TYPE="radio" NAME="Green"> Green
<BR><INPUT TYPE="radio" NAME="Blue"> Blue
<BR><INPUT TYPE="radio" NAME="Indigo"> Indigo
<BR><INPUT TYPE="radio" NAME="Violet"> Violet

</FORM>