> ## Documentation Index
> Fetch the complete documentation index at: https://docs.hyperwisor.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Database Form

> A form that writes its submission straight to a product database table.

<Info>
  **Category:** Controls · **Writes to:** the product database · **Reads data:** no
</Info>

## Mental model

A **Database Form is a data-entry slip.** Fill it in, submit, and the row lands
directly in a **database table** — no firmware round-trip. Think of it as the write
end of your product's database.

## When to use it

* Log an entry from the dashboard (a service note, a manual reading)
* Capture structured data that belongs in a table, not on a device

## Settings

### General

* **Widget Title / ID**
* **Auto-generate fields from table schema** — build the form from an existing
  table's columns automatically
* Per field: **label**, **type**, **placeholder**, **options**, **required**
* **Submit button label**
* **Reset after submit** — clear the form on success

### Style

Background, border, font, padding, container visibility.

### Where the data goes

On submit, the Database Form inserts a record into the bound table. It's the UI
equivalent of the [Database API](/api/database) insert or the Script API's
[`db.insert`](/script/database-api):

```js theme={null}
// equivalent programmatic write
await db.insert('service_logs', { note: '...', device: context.deviceId });
```

Display the stored rows with a [Table](/dashboard/widgets/display) or **Dynamic
Repeater** widget bound to the same table.

## Script API example

The same interactions from a [dashboard script](/script/overview):

```js theme={null}
widget.on('logForm', 'submit', async () => {
  const rows = await db.query('service_logs', {}, { limit: 1 });
  widget.setText('lastEntry', rows[0]?.note ?? '\u2014');
});
```

<CardGroup cols={2}>
  <Card title="Database (Studio)" icon="database" href="/studio/database">
    Create the schema and table first.
  </Card>

  <Card title="db.insert" icon="code" href="/script/database-api">
    The scripted equivalent.
  </Card>
</CardGroup>