Thursday, July 10, 2008

Forms - Radio buttons

In a set of radio buttons, only button can be chosen at a time. Here is the code to create radio buttons:
<input type="radio" name="sex" value="male" />Male<br />
<input type="radio" name="sex" value="female" />Female<br />
Each button has a different value attribute value. This is the data sent to the server application when the form is submitted. In the above example, if "Male" is selected then sex=male will be sent to the server application.
When the webpage is first loaded, by default none of the radio buttons are selected. However, once the user makes a choice, one button in the set of radio buttons will be selected - the radio buttons cannot be returned to their "all unselected" state.
After the page is loaded, if the user does not select any radio button and submits the form, then none of the radio button values will be submitted to the server; the name of the radio button controls will not even be present in the data transmitted to the server application.
To prevent the above scenario from occurring, include checked="checked" in the input tag that you want selected when the page is loaded. Of course, including this attribute for more than one radio button makes no sense.

No comments: