Toggle input

How to use

Toggle input is rendered using a template found in lib/templates/toggle.mustache.

The parameters for the template context are:

• id: Unique id for the toggle input.
• extraclasses: Any extra classes added to the toggle input outer container.
• checked: If the initial status is checked.
• disabled: If toggle input is disabled.
• dataattributes: Array of name/value elements added as data-attributes.
• title: Title text.
• label: Label text.
• labelclasses: Any extra classes added to the label container.

Examples

    {
        "id": "example-toggle-1",
        "checked": true,
        "dataattributes": [{
            "name": "action",
            "value": "toggle-status"
        }],
        "title": "Toggle Enabled",
        "label": "Enable/disable status",
        "labelclasses": "sr-only"
    }

    {
        "id": "example-toggle-2",
        "disabled": true,
        "extraclasses": "mt-2 ml-2",
        "dataattributes": [{
            "name": "action",
            "value": "toggle-status"
        }],
        "title": "Toggle Disabled",
        "label": "Enable/disable status"
    }

Use toggle as a template block

It is also possible to include core/toggle in any other template using blocks, instead of rendering it with a context. The parameters that you can define are:

• id: Unique id for the toggle input.
• extraclasses: Any extra classes added to the toggle input outer container.
• attributes: Any attributes added to the toggle input.
  • data-attributes
  • checked
  • disabled
• labelmarkup: Label element code block.
  • Should include class=“custom-control-label”.
• title: Title text.
• label: Label text.
• labelclasses: Any extra classes added to the label container.

    {
    }