FormRadio

Examples

Usage

Yes

Selected Value: ""

<FormRadio
  name="my-radio-input"
  @label="Yes"
  @value={{true}}
  @checked={{this.value}}
  @onChange={{this.setValue}}
/>

<FormRadio
  name="my-radio-input"
  @label="No"
  @value={{false}}
  @checked={{this.value}}
  @onChange={{this.setValue}}
/>

<p class="mt-4">Selected Value: "{{this.value}}"</p>

API

FormRadio

Element: <span class="hljs-title class_">HTMLInputElement</span>

Arguments

  
          Name
        
          Type
        
          Default
        
          Description
        
                  checked
                
                  *
                
                unknown
              
                -
            
              The current checked value.
This will be used to compare against the value argument,
if equal, the radio will me marked as checked.
            
                  onChange
                
                  *
                
                function
              
                -
            
              Callback when onchange is triggered
            
                  value
                
                  *
                
                enum
              
                -
            
              The value to be used in the radio button.
You must also pass onChange to update its value.
            
                  containerClass
                
                string
              
                -
            
              CSS classes to be added in the container element
            
                  hint
                
                string
              
                -
            
              A help text to be displayed
            
                  label
                
                string
              
                -
            
              The input field label
            
                  name
                
                string
              
                -
            
              The name of the checkbox
            
                  size
                
                enum
              
                -
            
              The size

Name	Type	Default	Description
`checked` *	`unknown`	-	The current checked value. This will be used to compare against the `value` argument, if equal, the radio will me marked as checked.
`onChange` *	`function`	-	Callback when onchange is triggered
`value` *	`enum`	-	The value to be used in the radio button. You must also pass `onChange` to update its value.
`containerClass`	`string`	-	CSS classes to be added in the container element
`hint`	`string`	-	A help text to be displayed
`label`	`string`	-	The input field label
`name`	`string`	-	The name of the checkbox
`size`	`enum`	-	The size

Blocks

Name	Type	Default	Description
`default` *	`Array`	-