More on radio buttons  

The effect
My favorite Beatle: John Paul George Ringo

My favorite single malt: Glenfiddich Laphroaig Lagavulin Bladnoch 1974

My favorite casino game: Blackjack Craps Video poker Slots

My choices:

Radio buttons are definitely a pain. This example analyzes radio button values by traversing the arrays defined by each group of buttons. The form is passed to it by reference in each onClick handler.

Code adapted from this page on the JavaScript Source site, but modified so it will work with Netscape Navigator.

Code in the page header

<SCRIPT>
<!-- 
// persistent variables
var vCat1=""; var vCat2=""; var vCat3="";

function getRadios(paramform){
// initialize counters
var j = 0; var i = 0 ;

// analyze categories
j=paramform.cat1.length;
	for (i=0; i
</SCRIPT>


The form

<FORM name="faves">

<b>My favorite Beatle:</B> 
<INPUT type=radio CHECKED value=John name=cat1 onClick="getRadios(document.faves)">John
<INPUT type=radio value=Paul name=cat1 onClick="getRadios(document.faves)">Paul 
<INPUT type=radio value=George name=cat1 onClick="getRadios(document.faves)">George
<INPUT type=radio value=Ringo name=cat1 onClick="getRadios(document.faves)">Ringo

<BR><BR>

<b>My favorite single malt:</B> 
<INPUT type=radio CHECKED value=Glenfiddich name=cat2 onClick="getRadios(document.faves)">Glenfiddich
<INPUT type=radio value=Laphroaig name=cat2 onClick="getRadios(document.faves)">Laphroaig
<INPUT type=radio value=Lagavulin name=cat2 onClick="getRadios(document.faves)">Lagavulin
<INPUT type=radio value="Bladnoch 1974" name=cat2 onClick="getRadios(document.faves)">Bladnoch 1974

<BR><BR>

<b>My favorite casino game:</B> 
<INPUT type=radio CHECKED value=Blackjack name=cat3 onClick="getRadios(document.faves)">Blackjack
<INPUT type=radio value=Craps name=cat3 onClick="getRadios(document.faves)">Craps
<INPUT type=radio value="Video poker" name=cat3 onClick="getRadios(document.faves)">Video poker
<INPUT type=radio value=Slots name=cat3 onClick="getRadios(document.faves)">Slots

<BR><BR>

<B>My choices:</B> 
<INPUT size=40 name=favorites>

</FORM>