# Value processor

The value processor is a tool for simple data manipulation and formatting operations that are run client-side.

Common use cases include:

* Toggling boolean values
* Incrementing integers such as a counter in a loop
* Shifting dates to find the beginning of the month or year for a date
* Formatting dates and numbers based on the end-user's locale settings
* Adding or removing references in a multi-reference property
* Format a Rich Text property to Plain Text, Markdown or HTML

## Usage

You can open the value processor from two places:

* From the three-dots menu after setting a value for a property.
* In the data binding dialog.

Once the value processor has been applied to a value, an icon will be shown next to the value. You can click this icon to open the value processor and view the operations in place.

## Operations

The operations that are available depend on the data type of the value. Operations can be chained, for example to first add a value and then to format it. The operations are evaluated in the same order they are added.

### Boolean

* **Invert Boolean** to toggle a boolean value.

{% hint style="info" %}
**Example**

Say you have a detailed view of an Employee. The view is usually read only but the employee can click a button to make it editable. You keep track of which state the view has by using a boolean property in App Variables, called *Employee edit enabled*.

Then you can create an action for the edit button with an Update Object action node for App Variables. For the *Employee edit enabled* property, select the existing *Employee edit enabled* value, and use the value processor to add an invert boolean operation.\
**Note:** inverting a boolean variable that has no value or is `Null` will return `True`
{% endhint %}

### Datetime

Detailed information about these operations is available under [Date and time](https://docs.appfarm.io/reference/date-and-time#value-processor). 

* **Add** a fixed number of datetime units to the value.
* **Subtract** a fixed number of datetime units from the value.
* **Start of** to shift the value to the start of a datetime unit.
* **End of** to shift the value to the end of a datetime unit.
* **Format** the value in a pre-defined or custom format.

{% hint style="info" %}
**Example**

In an app, you often need to consider data in a given period relative to today's date. Say you want to view *Assignments* that started within the last 3 months or that are starting in the next 3 months.

You can add two Datetime properties to App Variables, *Three months ago* and *Three months ahead*. Set both variables to the built-in value **Date Today**.

For *Three months ago* use the value processor to subtract 3 months and shift to the start of the day*,* while for *Three months ahead* use add three months and shift to the end of the day. Now you can use these two variables to filter the data source holding the *Assignments*.
{% endhint %}

### Float and Integer

* **Add** a fixed or data-bound number to the value.
* **Subtract** a fixed or data-bound number from the value.
* **Format** the integer or float as a string. You can e.g. specify the number of decimal places, hide the thousand-separator, or format the number as currency or percentage.

{% hint style="warning" %}
A general warning when using Value Processor to format a number or datetime to "built-in" types. E.g. formatting a datetime to `Short date` or a number to `Currency (NOK)`:\
**The output of these default may change over time, as they are controlled by third-parties or browsers.** \
E.g. when Appfarm Create upgraded the server-side node.js library from version 18 to 20, the output for the built-in value processor`Currency (NOK)` changed from "kr 20" to "20 kr". Do *not* build business logic that is hardcoded to these outputs (e.g. do *not* extract the "20" from the above string by using `substring(3,5`))
{% endhint %}

### Multi-reference property

* **Add** references to an existing list of references
* **Remove** reference from an existing list of references

{% hint style="info" %}
**Example**

Please see the value processor example in the [Update Object](https://docs.appfarm.io/library/action-nodes/update-object#multi-cardinaliy-value-processor) article.
{% endhint %}

### Rich Text property

* **Format** a Rich Text property to Plain Text, Markdown or HTML.

{% hint style="info" %}
**Example**

Please see the [Rich Text section](https://docs.appfarm.io/library/ui-components/text#rich-text) in the Text component article.
{% endhint %}