Create a Show/hide toggle button

Use a Button Set component with the Show/hide component action to allow users to show or hide a component, such as a table, form, or list.

Prerequisite

Before you begin, ensure that you have a Nintex Apps page with a functioning model. In this example, the page includes a model that displays account data. For more information, see Create and customize pages and Create and configure models.

Add a Show/hide button

  1. Add a Button Set to the canvas. For more information, see Add components to the canvas.
  2. Click the button within the newly added Button Set.

  3. In the Properties panel, under the General tab, complete the following fields:
    • Button label: Type a helpful label. For example, Show/hide Accounts.
    • Button icon: Add the icon you want.

    For more information, see Component properties.

  4. Click Save.

Add button actions

Important:  Using the Show/hide component action on a component that has its own display logic configured may result in unexpected behavior.

  1. Click the button within the newly added Button Set.

  2. In the Properties panel, under the Interactions tab, click Add.

  3. Click Add action flow.

  4. Click Create new action flow.

  5. On the Action flows canvas, click .

  6. Select Show/hide component. For more information, see Show/hide component.

  7. In the Settings panel, complete the following fields:

    • Behavior: Select Toggle.

    • Component: Select the component you want to show and hide from the drop-down list.

  8. Click Save.

    A Show/hide toggle button is added to your page. Users can click the button to show and hide the selected component.