# Update app data using accessors

### Example to use accessors

In the following example,  app data and accessors will be used to display and update data.

#### 1. Define app data

First, in the app data level, add a new data field named `test_number`, whose Data type is number, Storage type is "In Memory" and Default Data Value is 1.

![](/files/32Yj2fI5AQIOf0Rc4fQ2)

#### 2. Place a text element and [#access-data-in-the-configuration-panel](#access-data-in-the-configuration-panel "mention")

Drag a text element to the canvas and enter `${#app.test_number}` in text field. In the app view, the text will display the value of `test_number`.

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

#### 3. Place a button and add interaction

Drag a button onto the page below the text. Then, open the interaction panel to add an action: App -> Set app data after the event 'click button.' Next, click on the f(x) icon to edit the transformer.&#x20;

{% hint style="info" %}
Hint: the transformer uses JavaScript. \
For more information, refer to the related page: [Interactions](/app-builder/app-construction/interactions.md).
{% endhint %}

#### 4. Use transformer to update data and  [#access-data-in-the-transformer](#access-data-in-the-transformer "mention")

Using accessor, edit transformer code, remember to click the update button to save the change. Code for reference:

```
function transformer(payload, context) {
  const test_number = context.getData("#app.test_number");
	const updated_test_number = (test_number + 1) % 3;
  const parameters = {"field":"test_number","value":updated_test_number};
  return parameters;
}
```

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

#### 5. Click Preview to see the result

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


---

# 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.acho.io/app-builder/popular-use-cases/update-app-data-using-accessors.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.