Radio Object

By: aathishankaran Viewed: 1380 times  Printer Friendly Format    

You use the radio object to let a user select a single option from a group of options. If one option within a set is selected, no others can be selected at the same time. The act of clicking a radio button deselects any other radio button that was selected. 

The radio object is different from the other form objects you have worked with.

Whereas other form objects have a one-to-one correspondence to an HTML tag, a radio object has a one-to-many relationship with a set of <INPUT type="radio"> elements within the HTML source code. Each element of a radio object is defined as 


<INPUT TYPE="radio" [NAME="groupName"] [VALUE="value"] [CHECKED]

[onClick="methodName"]> [displayText] 

You do not group each of these elements together as you do the items in a select object The way they are grouped together is based on the NAME=parameter of the radio buttons. Each element in a radio object must use the same value in that parameter. For example, the following set of radio buttons are treated as a single radio object called weekdays: 


<INPUT TYPE="radio" NAME=”weekdays" VALUE="Monday">Monday <INPUT

TYPE="radio" NAME=”weekdays" VALUE="Tuesday">Tuesday <INPUT

TYPE=”radio" NAME=”weekdays" VALUE=”Wednesday”>Wednesday <INPUT

TYPE=”radio" NAME=”weekdays" VALUE="Thursday">Thursday <INPUT

TYPE="radio" NAME="weekdays" VALUE="Friday”>Friday <INPUT TYPE=”radio"

NAME=”weekdays" VALUE=”Saturday”>Saturday <INPUT TYPE=”radio"

NAME=”weekdays" VALUE="Sunday">Sunday 





Radio Button Example




<H1>Example for Radio Button</H1>

<H2>Click on the Radio Button and Know your Gender </H2>


<Form Name=form1>




<Input Type=Radio


Name = r1

onClick="alert('You selected Male')">



<Input Type=Radio


onClick="alert ('You selected Female')">









If you click on the Male Button

If you click on the Female Button

Most Viewed Articles (in JSP )

Latest Articles (in JSP)

Comment on this tutorial