# Send form input to a database

{% hint style="info" %}
[Upgrade your free account](/get-started/unlock-power-features-to-create-interactive-apps.md) to **Solo** **plan** to use this feature.
{% endhint %}

This tutorial is a continuation after you have set up a POST request to create data to a database.&#x20;

If you haven't done that yet, check out:

👉 [Connect to any API: POST request](/connect-api/set-up-api-requests/creating-an-api-collection/airtable/data-library-connect-to-any-api-post-request.md)\
\
💡 We're using this [design file](https://www.figma.com/community/file/1388482466816173335) and [this Airtable](https://airtable.com/shrjetk4AeKeUuumw) for the tutorial.

## How to bind POST request to form input design

Connecting functionality to your app design is done in the **Binding Setup** of an app project. `Binding` is the action of connecting an API request to an app element (i.e. text, rectangle, etc.)

1\. In your form design, **add the Bravo Tags for** [**input fields and submit button**](https://www.notion.so/0c35674e8c504dccbc19bc59a6ce0c4b). The example design file already includes these tags.

**Single-line text field:** `[component:input-text]`\
**Number field:** `[component:input-number]`\
**Submit button:** `[action:submit]`

![](/files/7vKsqwFqsecYkRS1WNOa)

2\. Import the design file into Bravo to create a project. 🚀

3\. In your app project page, click on the app screen with the form to enter **Data Binding** mode.

4\. **Select the collection and POST request** you previously created in the Data Library.\
(In this example, we're selecting the collection "**POST demo**" and the request "**Add Scores**".)

5\. In the Visual Elements list, **select your input field layer**.

![](/files/rIZQHVQ4Vl9TtfV54oq5)

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

6\. In the Element Binding side panel, you will see 2 selectable options for the input field: **Value** and **Input Destination**. In case you want to learn more on how to bind these two fields, check out [this page](/data-binding/data-binding-types/bind-multiple-properties-to-a-ui-element.md#binding-input-field-properties-to-api-data).

{% hint style="info" %}
**Value**: The data that is replacing the placeholder content.\
**Input Destination**: Where the input data is sent to.
{% endhint %}

7\. Since the POST request is for creating (sending) data to the database, you only need to **select the input for Content Destination**.

{% hint style="info" %}
Notice the Content Destination choices come from the **inputs in the Body of your POST request setup**.
{% endhint %}

![](/files/3PtdDuOYVkK8uhcLR1Yn)

8\. **Repeat step #5-7** until all of your input fields are bound.\
(No binding is needed for the submit button, just make sure you have the submit Tag on that element)

9\. Scroll down to **Response Actions** to configure the action that happens when the user presses the Submit button. By default, the app will show an alert message.

![](/files/Y05KY2fzTfaZvpvga0kN)

**Show Alert**: Display a pop-up message.\
**Go To Page**: Redirects user to another page in the app.\
**Open URL**: Opens the web browser on the phone with the specified URL.

10\. Test out your native form page with **Bravo Vision**! 📱

![](/files/s8Aw3vbeGXxZdIsp324U)

That's it! 🎉


---

# 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.bravostudio.app/bravo-tags/form-and-input-fields/data-biding-send-form-input-to-a-database.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.
