Documentation
Apps
Components
How to Use Button

How to Use Button

Setting Conditions to Disable Button

You can set conditions under which the button cannot be pressed.

Here, we will set the button to be disabled under the following conditions:

  • The text input named "name" is empty
  • The checkbox "Did you agree?" is not checked

Enter the following conditions in the [Disabled] tab on the right of the button component, and the button will be appropriately disabled.

{
  {
    input1.value === "" || !checkbox1.value;
  }
}

Also, by selecting the source component from [State] under [Components] in the lower editing screen and checking the value, you can verify that it is empty.

Adding Events

Execute Dataflow

Selecting [Run dataflow] will execute a specific dataflow when the button is clicked.

Copy

Selecting [Copy] will copy specific information as text when the button is clicked.

Enter the information you want to copy as text in [Text].

e.g., {{ table1.data }}, {{ text1.value }}

Export

Selecting [Export] will export data in a specific file format when the button is clicked.

Enter the data you want to export in [Data].

e.g., {{ listProducts.data }}, {{ table1.data }}

Set the file name when exporting in [File name].

Set the file format when exporting in [File type].

Checking [Include BOM] allows you to include a BOM when exporting.

This is effective in cases such as when characters are garbled in Excel.

※BOM inclusion is supported for CSV and TSV.

Open URL

Selecting [Open URL] will open the specified URL in a new tab.

Navigate Pages

Selecting [Go to page] will navigate to another page within the same app.

When navigating, you can also set query parameters to pass on to the destination page.

Operate Widget

Selecting [Control widget] allows you to manipulate the widgets you have placed.