As you design and build the page(s) for your application, you can apply components such as Buttons.

You can scroll down through the list of components in the Components menu, or use the Search field to navigate to the Button section.

You need to have a layout component in place when you place a button on the canvas.

More details on the different button components and how they can be used is provided in the following.

More details on the individual button components and how they can be used is provided in the following.

Button Component

Once you have added a layout component to a page, you can work with the different Options, Styles and Interactions to build the layout for the button and the interaction you want to apply.

Button

In the following example, the Button component is dragged and dropped on the canvas. Once dropped, click on the button to open the menu tabs (Options, Styles, Interactions) for building the buttons to your requirements.

Open Page Button component

Using the Open page button component, you can trigger that a specific page is opened.

The Configure open page button (A) pop-up window is displayed as shown below.

You can chose from an internal page (B). In this case, a menu of existing pages is displayed.

You can also specific an external page (C). You can copy and paste the page details in the field provided.

If you are not yet ready to assign a page, you can select the Add without configuration button (D). You can apply the configuration details at a later stage in the Options menu for the button.

Logout Button component

You can use the preconfigured Logout button to logout users with a redirect to a specific page, for example, your application's homepage. When you drag and drop the button to the canvas, the Configure logout button (A) dialog is displayed.

Press on the Select a page button to open the menu pull-down options for pages in your application. You can select a page from the list (C) as shown in the example. Then press the Select page button. The details of the redirect configuration are now shown in the Select a page field (B). You can change details if required by pressing the x button next to the page name. Press the Save button to apply the configuration details to the button.

If you now open the Interactions tab for the Logout button, you can view the interaction that has been configured. You can also edit and change the details of the interaction such as specifying a different page to which a user is redirected on logout.

To view the interactions that have been configured, select the button (A) and then select the Interactions tab (B) from the Button menu.

As shown, when the button is clicked (C), the logout function (D) is triggered and the user once logged out, is redirected to the applications homepage (E).

Delete Record component

You can use the delete record components with specific components such as a data component or component contain an object. As with the Logout button, the Delete Record button component is preconfigured. You can view the configurations in the Interactions tab when you select the Delete button.

When you apply the Delete button to a specific cell in a data table the Configure delete record pop-up window is displayed. You need to select the model (A) from your data model on which you want to apply the Delete button. In this case, the data to be deleted is from the a Bill of Material remote model (B). You need to press the Select (C) button to confirm that you want to use this model and then press Save (D) to apply the configuration.

As shown, the delete button is shown in the column selected (E).

You can use the various tabs (Options, Style, Interactions) to customize the button as required.

Note: When you work with the Delete record button, an additional Jump to parent context button is available that you can use to navigate directly to the overall data component.

Action Button component

You can build specific Action buttons for use across your application. The Action button component is part of the Actions module.

Actions can be used to apply workflow processes in your application. You can currently use the old IDE for building actions for your applications. Please refer to the Actions section in the help center for more information on working with Actions.

Did this answer your question?