# Using a single Form to add and update data

When you have two Forms in your working area, one for adding data and the other for updating it, finding space for more components may be challenging. For this purpose, to save some space, you may use a single Form for both data operations. Here's how you can do that.

{% hint style="success" %}
Here, we talk about the [Form](/reference/working-with-components/form.md) component.
{% endhint %}

## To use a single Form:

1. Drag a **Form** component to your working area.&#x20;
2. Next, to populate the data of a table's selected row, specify the `{{selectedRow.data}}` variable in the form's **Data** field.
3. Create a new action of the **Condition** type and specify the following code in the code field:

```javascript
return [null, undefined].includes({{ui.form.value.id}});
```

3\. Next, add an <mark style="color:green;">**if**</mark> condition:&#x20;

* specify for it a **Create Row** action
* specify the Form value object as `{{ui.form.value}}` in the *Configure Row* section.

4\. Add an <mark style="color:red;">**else**</mark> condition:

* specify for it an **Update Row** action
* configure the identifier in the *Filters* section as `id = {{ui.form.value.id}}`&#x20;
* specify the Form value object as `{{ui.form.value}}` in the *Configure Row* section.

5\. Next, navigate to the **Finish** step of the action and assign your load data action to the *On Success* trigger to update the data in the table.

6\. Finally, assign the **create/update action** you've created before to the *On Submit* trigger of the Form.

{% embed url="<https://demo.arcade.software/6ZPLY4uqkkh2KTSxdH3b?embed=&embed_desktop=inline&embed_mobile=tab&show_copy_link=true>" %}


---

# 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.uibakery.io/concepts/components/work-with-components/create-a-single-form-to-add-and-update-data.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.
