Cover Image for HTML Radio Tag
62 views

HTML Radio Tag

The <input> tag with the type="radio" attribute is used to create radio buttons. Radio buttons are commonly used in forms to present a set of mutually exclusive options where users can select only one option from the group. Here’s an example of how to use the HTML radio button:

HTML<span role="button" tabindex="0" data-code="<form> <div> <input type="radio" id="option1" name="options" value="option1"> <label for="option1">Option 1</label> </div> <div> <input type="radio" id="option2" name="options" value="option2"> <label for="option2">Option 2</label> </div> <div> <input type="radio" id="option3" name="options" value="option3"> <label for="option3">Option 3</label> </div>
<form>
  <div>
    <input type="radio" id="option1" name="options" value="option1">
    <label for="option1">Option 1</label>
  </div>
  <div>
    <input type="radio" id="option2" name="options" value="option2">
    <label for="option2">Option 2</label>
  </div>
  <div>
    <input type="radio" id="option3" name="options" value="option3">
    <label for="option3">Option 3</label>
  </div>
</form>

In this example, we have three radio buttons grouped together using the name attribute. The name attribute ensures that only one option can be selected within the same group. Each radio button has a corresponding <label> tag associated with it using the for attribute. The for attribute value should match the id attribute of the corresponding radio button.

When the user selects a radio button and submits the form, the selected option’s value attribute will be submitted to the server-side script or can be accessed via JavaScript for further processing.

Feel free to modify the example to suit your specific needs, such as changing the label text, adding more options, or customizing the styling.

YOU MAY ALSO LIKE...

The Tech Thunder

The Tech Thunder

The Tech Thunder


COMMENTS