Skip to main content

Toggle

Examples

Basic

PreviewAngularReactVueJavaScript

Custom label

PreviewAngularReactVueJavaScript

Disabled

PreviewAngularReactVueJavaScript

Checked

PreviewAngularReactVueJavaScript

Indeterminate

PreviewAngularReactVueJavaScript

API

Properties

Name
Description and specifications
checked
Whether the slide-toggle element is checked or not.
Attribute:
checked
Type:
boolean
Default:
false
disabled
Whether the slide-toggle element is disabled or not.
Attribute:
disabled
Type:
boolean
Default:
false
hideText
Hide `on` and `off` text
Attribute:
hide-text
Type:
boolean
Default:
false
indeterminate
If true the control is in indeterminate state
Attribute:
indeterminate
Type:
boolean
Default:
false
name
Name of the checkbox component
Attribute:
name
Type:
string | undefined
required
Required state of the checkbox component. If true, checkbox needs to be checked to be valid
Attribute:
required
Type:
boolean
Default:
false
textIndeterminate
Text for indeterminate state
Attribute:
text-indeterminate
Type:
string
Default:
'Mixed'
textOff
Text for off state
Attribute:
text-off
Type:
string
Default:
'Off'
textOn
Text for on state
Attribute:
text-on
Type:
string
Default:
'On'
value
Value of the checkbox component
Attribute:
value
Type:
string
Default:
'on'

Events

Name
Description and specifications
checkedChange
An event will be dispatched each time the slide-toggle changes its value.
Detail:
boolean