> For the complete documentation index, see [llms.txt](https://docs.adapptio.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.adapptio.com/working-with-adapptio/how-to/data-and-dynamic-values/sending-data-to-action-from-a-form.md).

# Sending Data to Action from a Form

### The Goal

Send data from form components to action by triggering a button event.

![Form for sending filled data](/files/h8cwY7CssoJg0Tv7XDOI)

### What We Are Going to Do

{% tabs %}
{% tab title="Project Structure" %}

* [ ] Action \[`updateTask`]
  * [ ] *Parameters*

    * [ ] `id` \[*Integer*]
    * [ ] `name` \[*String*]
    * [ ] `content` \[*String*]

* [ ] View \[`Form`]
  * [ ] Container \[`container1`]
    * [ ] Text Field \[`fldName`]
    * [ ] Text Area \[`fldContent`]
    * [ ] Button \[`button1`]
      {% endtab %}

{% tab title="View\[dataFromAction]" %}
![](/files/ZrQyvF32gRPrZ09ED2fm)
{% endtab %}

{% tab title="Action\[updateTask]" %}
![](/files/nmZfP9Lgj88ITI7JCoaB)
{% endtab %}
{% endtabs %}

### 1. Create an Action

First, lets create blank action with fixed input parameters.

1. From the *Main Menu*, create a new **Action** and name it `updateTask`.
2. In the Outline panel add three parameters by clicking on the Plus button.
   1. Rename the parameters on `id`, `name`, and `content`.
   2. Set up properties of `id` to *Integer* in the *Inspector* panel, and switch *Required* to `true`. It makes the parameter mandatory.
   3. Leave the `name` and `content` configure to *String*.
3. All available parameters are visible in the *Tester* panel, where a yellow warning shows mandatory blank parameters. In our case `id`.
4. Try filling some values in the testing parameters corresponding to the *value-type* and clicking the `Save & Run button`.
5. If the input parameters are valid *Tester* output will returns following:

```
status: "LOADED"
output: null
```

{% tabs %}
{% tab title="Create updateTask Action" %}
![](/files/76PUF9VdBuvAw2cIChll)
{% endtab %}

{% tab title="Setting Input Parameters" %}
![](/files/36WHSU4WXnbl4ZkhMTEt)
{% endtab %}

{% tab title="Required Integer id" %}
![](/files/4al5J3iejdXhDhtheJUb)
{% endtab %}
{% endtabs %}

### 2. Design a Basic Form

Design a basic form containing **Text Input** and **Text Field** components.&#x20;

1. Put a **Container** on the canvas *work-field* and name it `container1`.
2. Set up its layout on *Stretch* with horizontal alignment at right.
3. Place **Text Input** into`container1`, name it`fldName`, and set up its *Label* on 'nam&#x65;*'*.
4. The next component placed will be a **Text Area**, named `fldContent`, and labeled 'content'
5. *Values* of both components can be filled as a *constant* or mapped by action from the previous [Loading Data Tutorial](/working-with-adapptio/how-to/data-and-dynamic-values/loading-data-from-action-to-form.md); what is exactly our case here.
6. *Values* of `fldName` are set up `task.data.name`; `fldContent` *value* is `task.data.content`.

{% tabs %}
{% tab title="Form Components" %}
![](/files/qoTnNiHKyPjGKHQhMQA7)
{% endtab %}

{% tab title="Text Input Setting" %}
![](/files/M7ZXZOB2R8DzYBCqwVqq)
{% endtab %}

{% tab title="Text Area Setting" %}
![](/files/xovJxP9Tl33ZpQgwPDkt)
{% endtab %}

{% tab title="Current Outline" %}
![](/files/hixCL34ajyF6ZKYsknEE)
{% endtab %}
{% endtabs %}

### 3. Binding a Button with Action

Clicking the new button triggers an event bound with our action.

1. Place a new **Button** component into `container1` and name it `button1`.
2. Design it as you wish, or leave it at the *Default*.
3. Switch from *Options* to *Event panel* in the *Inspector* and clicking on the 'click' option will open the *Event editor*.
4. Drag & Drop **Call Action** component to *Flow canvas* and wire it together with **Event Start**.
5. Selecting the **Call Action** component allows us to define its attributes in *Inspector*.
6. Click on 'Click to select' and choose `updateTask` action.
7. Blank parameters will appear at *Inspector* that moment.
   1. Set up parameters *Values* on the following: `id` -> `task.data.id`; `name` -> `fldName.value;` `content` -> `fldContent.value`
8. We are done! *Data* will be sent to the action by clicking on the `button1` in *Preview mode* or after *Application deployment*.

{% tabs %}
{% tab title="Flow Event Canvas" %}
![](/files/kEbPsQLtYavORXh95kut)
{% endtab %}

{% tab title="Call Action Parameters" %}
![](/files/PzcI3jWMGcuaLcePo9xa)
{% endtab %}

{% tab title="Final Outline" %}
![](/files/ihE1sahXxCJBRwK3mqre)
{% endtab %}
{% endtabs %}

### The Conclusion

This method is commonly used to reference any outgoing forms or other components values referenced to action.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://docs.adapptio.com/working-with-adapptio/how-to/data-and-dynamic-values/sending-data-to-action-from-a-form.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.
