You are here: Reference > HTML > tags > input:radio

input:radio element

Browser support:
Creates a radio button control.
The radio button allows the user to choose one of a predefined set of options. You can define groups with the name attribute of the radio buttons.
  • Radio buttons with the same name belong to the same group.
  • Radio buttons with different names belong to different groups.
  • At most one radio button can be checked in a group.
If you need to use independent options, choose the input:checkbox element instead.
Using many items in the same radio group results in an incomprehensible user interface. Use the selection list element in that case. This control is one of the form controls.
The state of the control can be submitted to a server if the following conditions are met:
  • A form element must contain the radio button element.
  • The action attribute of the container form must be set to the URL of the server.
  • The name attribute of the radio button must be specified and non-empty.
If the control is in checked state when the container form is submitted, the name of the radio button is sent with the value of the value attribute. If the control is not checked, no information belonging to the radio button is sent with the form. The default value of the value attribute is 'on' for radio buttons, but the attribute is writable. Define different values for radio buttons in the same group, otherwise you cannot identify on the server side which one was checked.
If you want to see the HTML tags by categories, please visit this page.
This element cannot have a closing tag.
JavaScript page for this element: input:radio.

Possible members:

Attributes
Events
Styles
Pseudos
accessKey
Sets an access key to an element.
CHECKED
Specifies the initial state of a check box or a radio button.
class
Sets the style class or classes that belong to the element.
contentEditable
3
Sets whether the contents of the object are editable.
dir
Sets the text direction as related to the lang attribute.
DISABLED
Sets the state of an object for user interaction.
HIDEFOCUS
Specifies whether a dotted rectangle (focus rectangle) is drawn around an object while it has focus.
hSpace
Specifies the number of pixels to use as a margin at the left and right sides of the object.
id
Sets a unique identifier for the object.
lang
Specifies the language of the element.
language
Sets the scripting language for the current element. Use it only for the script element.
name
Sets the name of a form control that affects the contents of the message submitted to the server.
size
Specifies the width of a control, in characters.
style
Sets an inline style associated with an element.
tabIndex
Specifies the tabbing order for keyboard navigation using the TAB key.
title
Specifies a tooltip for an element.
type
Sets the type of the input element.
unSelectable
Sets whether the selection process can start in an element's content.
value
Specifies the initial value for a control element.
vSpace
Specifies the number of pixels to use as a margin at the top and bottom sides of an object.

Example HTML code 1:

This example illustrates the use of the radio button element:
<form method="post" action="#URL#">
    <input type="radio" name="sex" id="radio_female" value="female" checked="checked" /> 
    <label for="radio_female">female</label>
    <br />
    <input type="radio" name="sex" id="radio_male" value="male" /> 
    <label for="radio_male">male</label>
    <br /><br />
    <input type="submit" value="Register" />
</form>
Did you find this example helpful? yes no

Related pages:

External links:

User Contributed Comments

Post Content

Post Content