Aware Controls | JavaScript (ES5) Switch Demos

The Switch control allows users to toggle between checked and unchecked states.

Basic Functionality

Demonstrates the basic functionality of the Switch control.

Default Switch

Disabled Switch

new ac.toggles.Switch(
    {
        name: "question1",
        value: "question1"
    },
    "#cntlDefault"
);

new ac.toggles.Switch(
    {
        name: "question2",
        value: "question2",
        disabled: true
    },
    "#cntlDisabled"
);

<div class="form-horizontal form-bordered">
    <div class="form-group row">
        <label class="form-label col-form-label col-lg-4">Default Switch</label>
        <div class="col-lg-8">
            <input id="cntlDefault" />
        </div>
    </div>
    <div class="form-group row">
        <label class="form-label col-form-label col-lg-4">Disabled Switch</label>
        <div class="col-lg-8">
            <input id="cntlDisabled" />
        </div>
    </div>
</div>