Button

This element executes an action on user click.

See examples

Note

This element is not available in the CyberApp enablement form.

Properties

• ID

  Element identifier.
• Label

  The button label text.
• Type (see examples)

  The button type. Each type has a different style.

  • Primary

  • Secondary

  • Danger

  • Ghost

  • Promo

  • Translucent

• Width (see examples)

  • Default

    This is for backward compatibility purposes only.
  • Fit (default)

    Sets the width to accomodate the label.
  • Fill

    Uses all of the available width.

    For more information, see Element distribution.
• Padding (see examples)

  The internal padding of the button, which determines its overall size.

  • Small

  • Medium (default)

  • Large

• [Optional] Icon name (see examples)

  Inserts an icon to the left of the label.

  If you select a monochrome icon, it is displayed in white. A colored icon is displayed unaltered.
• On click

  The action executed when the user clicks the button.

  • Close Form

    The form closes if the user clicks the button.
  • Callback

    A callback is executed.

    1. Choose the callback from the Callback name dropdown.

    2. Specify any request and response mappings you require

  • Open form

    A form is opened.

    1. Choose the Mode:

       • Popup

       • Sidebar

         Note

         The demo CyberApp illustrates both options.

    2. Choose the form in the Form name dropdown.

    3. [Optional] Map input parameters

  • Other

    Select the Action type from the dropdown:

    • Set Parameters

      This option allows you to explicitly set form element and input parameter values if the user clicks the button. A common use for this functionality is for a reset filters button without executing a callback.

      When you select this option, an JSON edit panel appears, where you must provide JSON to apply when the user clicks the button. The edit panel is interactive: it suggests element IDs and parameters as you type, highlights invalid IDs and parameters, and indicates invalid values.
    • No action

      The button does nothing.

Examples

Button types

Button width examples

Button padding examples

Button icons examples