VisualWikitext
 
 
(8 intermediate revisions by 4 users not shown)
Line 1: Line 1:
 +
===Name===
 +
radio
 +
===Type===
 +
input
 +
===Synopsis===
 +
How to use radio buttons
 +
===Description===
 +
input elements of type radio are generally used in radio groups—collections of radio buttons describing a set of related options. Only one radio button in a given group can be selected at the same time. Radio buttons are typically rendered as small circles, which are filled or highlighted when selected.
 +
===Parameters===
 +
input type="radio"
  
 +
All other valid HTML5 attributes are allowed
 +
===Example===
 +
<syntaxhighlight lang="html">
 +
<p>Select a maintenance drone:</p>
 +
<div>
 +
  <input type="radio" id="huey" name="drone" value="huey" />
 +
  <label for="huey">Huey</label>
 +
</div>
 +
 +
<div>
 +
  <input type="radio" id="dewey" name="drone" value="dewey" checked="checked" />
 +
  <label for="dewey">Dewey</label>
 +
</div>
 +
 +
<div>
 +
  <input type="radio" id="louie" name="drone" value="louie" />
 +
  <label for="louie">Louie</label>
 +
</div>
 +
</syntaxhighlight>
 +
<p>Select a maintenance drone:</p>
 +
<div>
 +
  <input type="radio" id="huey" name="drone" value="huey" />
 +
  <label for="huey">Huey</label>
 +
</div>
 +
 +
<div>
 +
  <input type="radio" id="dewey" name="drone" value="dewey" checked="checked" />
 +
  <label for="dewey">Dewey</label>
 +
</div>
 +
 +
<div>
 +
  <input type="radio" id="louie" name="drone" value="louie" />
 +
  <label for="louie">Louie</label>
 +
</div>
 +
===Note===
 +
Radio buttons are similar to checkboxes, but with an important distinction — radio buttons are grouped into a set in which only one radio button can be selected at a time, whereas checkboxes allow you to turn single values on and off. Where multiple controls exist, radio buttons allow one to be selected out of them all, whereas checkboxes allow multiple values to be selected.
 +
===Links===
 +
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio
ws-class-props
Line 1: Line 1:
−
 
+
{{Doc properties
 +
|Doc subject=DevOps:Doc/FlexForm
 +
|Subject version=1.0,1.1
 +
|Doc parent=DevOps:Doc/FlexForm/1.0/input
 +
|Doc sort order=110
 +
|Doc target group=User
 +
|Doc synopsis=How to use radio buttons
 +
}}
ws-page-props
Line 1: Line 1:
−
{{Doc properties
+
 
−
|Subject version=1.0.0
 
−
|Doc subject=DevOps:Doc/FlexForm
 
−
}}
 

Latest revision as of 12:02, 23 November 2022

Name

radio

Type

input

Synopsis

How to use radio buttons

Description

input elements of type radio are generally used in radio groups—collections of radio buttons describing a set of related options. Only one radio button in a given group can be selected at the same time. Radio buttons are typically rendered as small circles, which are filled or highlighted when selected.

Parameters

input type="radio"

All other valid HTML5 attributes are allowed

Example

<p>Select a maintenance drone:</p>
<div>
  <input type="radio" id="huey" name="drone" value="huey" />
  <label for="huey">Huey</label>
</div>

<div>
  <input type="radio" id="dewey" name="drone" value="dewey" checked="checked" />
  <label for="dewey">Dewey</label>
</div>

<div>
  <input type="radio" id="louie" name="drone" value="louie" />
  <label for="louie">Louie</label>
</div>

Select a maintenance drone:

Note

Radio buttons are similar to checkboxes, but with an important distinction — radio buttons are grouped into a set in which only one radio button can be selected at a time, whereas checkboxes allow you to turn single values on and off. Where multiple controls exist, radio buttons allow one to be selected out of them all, whereas checkboxes allow multiple values to be selected.

Links

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio

Retrieved from "https://www.open-csp.org/index.php?title=DevOps:Doc/FlexForm/1.0/input/radio&oldid=1866"