The HTML Form - Radio Button and Checkbox Input Tags - 2
|In the first section of this tutorial we discussed how the radio input tag works. Now let's take a look at the code.|
Let's take a look at an example of one of the three radio input tags used in the previous example.
<input type="radio" name="color" value="Red"> Red
<input type="radio" name="color" value="White"> White
<input type="radio" name="color" value="Blue"> Blue
|What Does The Code Mean|
| < ||Left angle bracket|
|input ||The element name|
|type||The type attribute is set to radio to create a radio button (type="radio").|
|name||The name attribute is used to set an identification for the input field. In order for the radio input tags to work as a group, you will need to set the name attribute to the same for all of the radio tags in the group (name="color").|
|value ||The value attribute is used to set the value for each radio button in the group. Each of the radio tags will have the value attribute set to a different value. For example, if you want the user to choose between Red, White and Blue; you would have three radio buttons with the value attribute set to a different color for each.|
|checked||The checked attribute is used to set one of the radio buttons as selected by default when the webpage form is displayed on the webpage.|
|>||Right angle bracket|
In the next section of this tutorial we will discuss the checkbox input tag.
- As you can see, these radio input tags can work together as a group because they all have the same value for the name attribute (name="color").
- It is the value attribute that determines the value of each individual radio button. In the example, we have three radio buttons with their value attributes set to Red, White and Blue.
- If we wanted one of the radio buttons to be selected when the form displays on the webpage (i.e. by default) we would include "checked" within that radio input tag.
← Back | Next →
This site needs an editor - click to learn more!
Editor's Picks Articles
Top Ten Articles
Content copyright © 2019 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact