Edit in GitHubLog an issue
Thanks to Atwix for contributing this topic!

CheckboxToggleNotice component

The CheckboxToggleNotice component implements the Checkbox component with the ability to switch notice according to the selected option.

Options

OptionDescriptionTypeDefault
component
The path to the component's JS constructor in terms of RequireJS.
String
Magento_Ui/js/form/element/single-checkbox-toggle-notice
notices
The array of notices that should be associated by key with selected option value.
Array
[]
tracks.notice
Flags that enable tracking for the notice option. By default, the notice option is tracked to allow updating the notice message in the template.
Boolean
true

Source files

Extends the Checkbox component:

Example

Integration

This is an example of how to integrate the CheckboxToggleNotice component with the Form component:

Copied to your clipboard
<form>
...
<fieldset>
...
<field name="checkbox_toggle_notice_example" component="Magento_Ui/js/form/element/single-checkbox-toggle-notice" formElement="checkbox">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="default" xsi:type="number">0</item>
<item name="notices" xsi:type="array">
<item name="0" xsi:type="string" translate="true">Notice #1</item>
<item name="1" xsi:type="string" translate="true">Notice #2</item>
</item>
</item>
</argument>
<settings>
<dataType>boolean</dataType>
<label translate="true">Checkbox Toggle Notice</label>
</settings>
<formElements>
<checkbox>
<settings>
<valueMap>
<map name="false" xsi:type="number">0</map>
<map name="true" xsi:type="number">1</map>
</valueMap>
<prefer>toggle</prefer>
</settings>
</checkbox>
</formElements>
</field>
</fieldset>
</form>

Result

CheckboxToggleNotice with Selected Option #1 Component Example CheckboxToggleNotice with Selected Option #2 Component Example

  • Privacy
  • Terms of Use
  • Do not sell or share my personal information
  • AdChoices
Copyright © 2024 Adobe. All rights reserved.