Toggle

A <input type="checkbox"> element that visually behaves like an on/off toggle switch.

Options

Stacking CSS Classes

Clashing CSS Classes

Code Example

<A_InputCheckboxToggle Id="@("exampleToggle")"
					   Class="@("-left")"
					   Label="@("Toggle Name")"
					   JsOnChange="@("mcsUi.exampleToggleAlert()")" />

Parameters

Required Parameter Type Default Notes
False ParentId String Empty In case you need to target the outter most element.
False Id String Empty The ID applied to the actual <input /> element.
False Class String .a_button See above additional class options
False DataTarget string Empty Defines the data-target="" attribute for using Javascript to target elements by Id.
False JsOnChange string Empty Defines the onchange="" attribute for triggering javascript functions.
False BlazorOnChange EventCallback Empty Defines the @onchange="" attribute for triggering Blazor functions.
True Label string Empty Used for the text displayed on the button.
False Type string checkbox Defines the type of input. Eg, Checkbox, Radio etc
False Group string Empty Used for grouping Radio inputs.
False ToggleFalseLabel string Off The flase label within the toggle rail.
False ToggleTrueLabel string On The true label within the toggle rail.
False Checked boolean false Used to precheck this toggle.
False Disabled boolean false Used to deactivate the toggle.