# Load Row

The Load Row action allows you to load a row from a table by a given condition.

The action returns a single object:

```json
{
  id: 1,
  name: "Bobbie Bogan II",
  first_name: "Bobbie"
}
```

## Filtering

You can specify the filter condition to locate the row to load, for example:

```javascript
// id = 23
{{ui.table.selectedRow.data.id}}
```

<figure><img src="https://837703843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUX6zPRMFFK0yrTghj7cY%2Fuploads%2FI4K2FxjZMuY1tukHaUbH%2FCleanShot%202025-05-19%20at%2012.53.56%402x-min.png?alt=media&#x26;token=5721101b-e435-48c8-acd0-b257203b671b" alt=""><figcaption></figcaption></figure>

You can also specify multiple conditions - the row will be loaded if all conditions are met.

The condition(s) you specify will be sent to the server and converted to a `SELECT` statement, for example:

```sql
SELECT * FROM users WHERE id = 23 LIMIT 1;
```

In the action's *Payload* tab, you can check the actual condition sent to the server.

{% hint style="warning" %}
If **no** conditions are specified, the first table row will be loaded.
{% endhint %}

You can also use various *condition operators* to filter the table. For example, the `like` operator allows you to load rows with a partial match.

## Data transformation

If the database returns its data in a different format than expected for the components, you can modify it. For example, you can turn on the **Transform result** toggle in the action's settings or add a  *JavaScript Code* step to transform the data.

Then, you can map the object to a proper format:

```javascript
return {
  ...{{data}},
  name: {{data}}.name.toUpperCase(),
};
```

Or add new properties:

```javascript
return {
  ...{{data}},
  created_at: new Date(),
};action
```