# Actions

Action is an operation that you can perform in Jet Admin. Visually, the action is a button in the Jet Admin interface.

To add an action you need to 

1. Select a Button component 
2. Drag and drop it on the page

{% @arcade/embed flowId="i0thUp5Um7Dt4k0G8ga1" url="<https://app.arcade.software/share/i0thUp5Um7Dt4k0G8ga1>" %}

## Action types

There are a variety types of actions that are split into sections:&#x20;

### Data

* **Run operation**. Perform any CRUD operation or custom API/SQL query.&#x20;
* **Export Data.** Export data from the table.
* **Import Data**. Import data to a collection.&#x20;

### Navigation

* **Navigate to page**. Passing values and switching between pages.
* **Open URL.** Open the link in a new or the current tab.

### Overlays

* [**Open Actions Dropdown**](#open-actions-dropdown)**.** Create a sub-menu of actions.
* [**Open Overlay/Close Overlay**](/user-guide/design-and-structure/components/modal.md)**.** Open or close the overlay.

### Interaction

* [**Show Notification**](/user-guide/design-and-structure/components/custom-notifications.md)**.** Show custom notification.
* **Copy to Clipboard**. Copy data to your Clipboard.&#x20;
* [**Run Component Action**](/user-guide/design-and-structure/components/component-actions.md)**.** Act on a component, such as updating data or clearing the form after submitting.

### Advanced

* [**Set Variable**](/user-guide/variables.md#set-a-variable). Set a value to a specific Page Variable or Page Variable .&#x20;
* [**Run JavaScript**](/user-guide/design-and-structure/actions.md#run-javascript). Execute a JavaScript code.&#x20;
* **Download File.** Download the file from the API call.
* [Scan QR/Bar Code](/user-guide/design-and-structure/components/qr-code.md). To scan a graphic code.

**Run workflow**

* [**Run Workflow**](/user-guide/workflow.md). Fires a sequence of events.

<figure><img src="/files/VdDkHMMQUuUjJO69R9N3" alt=""><figcaption></figcaption></figure>

## Action confirmation dialog

You can set up a confirmation dialog that will appear before executing an action.

<figure><img src="/files/oA4E9flIxHx8y6UtW6TN" alt=""><figcaption><p>Confirmation dialog example</p></figcaption></figure>

To add a confirmation dialog, use the "Confirm on execute" section of the right-side panel

<figure><img src="/files/XrWwfJnyYIabe9QbN0Ge" alt=""><figcaption></figcaption></figure>

You can define the Title, Description, and button styles for your confirmation dialog.

<figure><img src="/files/wZOFcQrQPkp9PCZ54cpF" alt=""><figcaption></figcaption></figure>

### Run Operation

Perform operation with your resources, such as CRUD operations with Databases, operations with third party services, APIs and frameworks, and operations with storages.

#### Creating an operation in a button

1. Click on the **Button**
2. Go to the **Click Action**
3. Choose **Run Operation**
4. Choose the **Resource**
5. Choose the **Action**

{% @arcade/embed flowId="hiEUE1MH878JTe5ffe6h" url="<https://app.arcade.software/share/hiEUE1MH878JTe5ffe6h>" %}

#### Operations with storages

<figure><img src="/files/mKM8KMwXK3nkeVIoTqMe" alt=""><figcaption><p>Storages operations</p></figcaption></figure>

You can perform these actions with storages:

* Getting private file URL
* Uploading a File
* Getting list of objects
* Creating a directory
* Removing an object

### Navigate to Page

You can pass values and switch between pages. To do so, follow the steps:

1. Click on the Button
2. Go to the **Click Action**
3. Choose **Navigate to Page**
4. Choose the **Link of the Page**

{% @arcade/embed flowId="yxx0Jn0fHFHMr0z3wb7O" url="<https://app.arcade.software/share/yxx0Jn0fHFHMr0z3wb7O>" %}

### Open URL

Opens any website URLs, use **Action** specified as **Open URL**.

1. Click on the Button
2. Go to the **Click Action**
3. Choose **Open URL**
4. Click on the URL icon to change the **URL of the Page**

{% @arcade/embed flowId="XEOidwMdpzMphdDs7lpw" url="<https://app.arcade.software/share/XEOidwMdpzMphdDs7lpw>" %}

### Open/Close Overlay

{% @arcade/embed flowId="7bf7uWU3nOnGSNBOeSkG" url="<https://app.arcade.software/share/7bf7uWU3nOnGSNBOeSkG>" %}

You can close the pop-up overlay window. To do so, follow the steps:

1. Click on the **Button**
2. Go to the **Click Action**
3. Choose **Close Overlay**

{% @arcade/embed flowId="YpWbACsL2fhufqFzWLyY" url="<https://app.arcade.software/share/YpWbACsL2fhufqFzWLyY>" %}

{% content-ref url="/pages/-MikDXjv2LX\_P0vjwNGT" %}
[Overlay](/user-guide/design-and-structure/components/modal.md)
{% endcontent-ref %}

### Open Actions Dropdown

<figure><img src="/files/0xuylxmjme7Z588Y2IaO" alt=""><figcaption></figcaption></figure>

The Open Actions Dropdown feature allow you to create a list of multiple separate actions that will appear in a drop-down list. This dropdown menu facilitates triggering queries and other actions with ease.

* **Multiple Actions**: Create a list of distinct actions that users can select from a dropdown menu.
* **Ease of Use**: Simplify the process of triggering various actions from a single interface element.
* **Manual Configuration**: Customize the actions list according to specific requirements.

{% @arcade/embed flowId="QzVEDPOQLgwJY5RLtdO6" url="<https://app.arcade.software/share/QzVEDPOQLgwJY5RLtdO6>" %}

### Run Component Action

You can act on a component, such as updating data or clearing the form after submitting.

{% content-ref url="/pages/-MW468m4mzBTZ3GUnWrd" %}
[Component Actions](/user-guide/design-and-structure/components/component-actions.md)
{% endcontent-ref %}

### Show Notification

You can show custom notifications.

{% content-ref url="/pages/-MW460m0KIROY3WLp-SG" %}
[Custom Notifications](/user-guide/design-and-structure/components/custom-notifications.md)
{% endcontent-ref %}

### Run JavaScript

To execute JavaScript code upon clicking a button, follow these steps:

1. Click on the button.
2. Navigate to the Click Action.
3. Select "Run JavaScript."
4. Type your JavaScript code and return the result.

<div align="left"><figure><img src="/files/ArqkowC3gIFHVNZISawJ" alt=""><figcaption></figcaption></figure></div>

<figure><img src="/files/hE7yq2xyhVIJILhs3hhg" alt=""><figcaption></figcaption></figure>

\
You can Insert input values from other components and use it further within your JavaScript code. To do that, click 'Insert Input' and choose the needed component.

<figure><img src="/files/GUPTZhKMJh9TfG2siw4T" alt=""><figcaption></figcaption></figure>

### Export Data

You can export data from the table. To do so, follow the steps:

1. Click on the **Table**
2. Go to the `Actions Tab`
3. Scroll down to the **Header Actions**
4. Click on the `New Action`
5. Choose **Export Data**
6. Choose the **Resource** and the **Collection**

{% @arcade/embed flowId="1Q2l8eurRAfAenociloS" url="<https://app.arcade.software/share/1Q2l8eurRAfAenociloS>" %}

### Download File

1. Click on the **Button**
2. Go to the **Click Action**
3. Choose **Download File**

{% @arcade/embed flowId="XO6aKLkHar5GxSw8zbMT" url="<https://app.arcade.software/share/XO6aKLkHar5GxSw8zbMT>" %}

Now, let's define the Resource and Operation. To do so, follow the steps:

1. Click on the button
2. Pick a resource&#x20;
3. Choose an operation to write SQL queries
4. Write the SQL query
5. Click on the Run button
6. Click on the Save button

This will generate a JSON file with the data.

{% @arcade/embed flowId="xx2LzwkiSKjxpFTs5v7f" url="<https://app.arcade.software/share/xx2LzwkiSKjxpFTs5v7f>" %}

### Copy to clipboard

You can set up actions to copy data to the clipboard. This works with all components. To configure it, follow the steps:

1. Go to the **Actions Tab**
2. Go to the **Row Click**
3. Choose **Copy to Clipboard**&#x20;
4. Click on the `Set up with Formula` icon
5. Choose **Email**

{% @arcade/embed flowId="9Ht0CPoM0ZmenIUSZx03" url="<https://app.arcade.software/share/9Ht0CPoM0ZmenIUSZx03>" %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.jetadmin.io/user-guide/design-and-structure/actions.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.