Upload
Pick or drop a file. The file is exposed on the component’s value and through the fileReceived event, so a script can store it anywhere.
Reach for it when you need:
- Attaching a photo to a downtime record
- Importing a CSV for a pipeline to process
Component name: Upload · Category: Input
In the palette: Pick / drop a file — store it anywhere via its value or the fileReceived event
Properties
Any property can be bound to a tag, another component's property, or a query.
| Property | Type | Default | Description |
|---|---|---|---|
value | union | "" | The file reference: a server URL (server mode) or an inline data URL (data mode). Bind this to a write Named Query param to store it. Array when 'multiple'. |
storageMode | enum | server | server = upload to the sandboxed uploads folder and keep a URL; data = keep the file inline as a base64 data URL (small files only). Options: server · data. |
folder | string | "" | server mode: destination folder under the uploads root (e.g. invoices/2026). Supports {{bindings}}. Confined to the sandbox — it can't escape the uploads root. |
multiple | boolean | false | Allow selecting several files (value becomes an array of references). |
accept | string | "" | Allowed file-type filter, e.g. image/*,.pdf. Blank = any. |
maxSizeMB | number | 25 | Reject files larger than this many MB (0 = no widget limit). This can only TIGHTEN the platform limit set in Settings → Storage — the server enforces the global cap regardless. |
dropzone | boolean | true | Show a large drag-and-drop area instead of a single button. |
buttonLabel | string | Choose file | — |
showPreview | boolean | true | Show image thumbnails for image files. |
title | string | Upload | — |
showTitle | boolean | true | — |
titleSize | number | 13 | — |
shadow | boolean | true | Show a subtle drop-shadow on the control. Turn off for a flat look. |
disabled | boolean | false | — |
style | style | {} | Custom CSS properties |
Events
Attach event actions to these in the Event Manager.
| Event | Label | Group | Payload |
|---|---|---|---|
click | Click | Mouse | The DOM event. |
dblclick | Double click | Mouse | The DOM event. |
contextmenu | Right click | Mouse | The DOM event. |
mouseenter | Mouse enter | Mouse | The DOM event. |
mouseleave | Mouse leave | Mouse | The DOM event. |
change | Change | Input | The DOM event. |
submit | Submit | Input | The DOM event. |
focus | Focus | Input | The DOM event. |
blur | Blur | Input | The DOM event. |
fileReceived | File received | Upload | File metadata, under file / files. |
contextmenu fires your configured actions at runtime only — in LiveView and in preview. On the Designer canvas the right-click is captured to open the Event Manager, so testing it there will not run your actions. Test right-click in preview.
Notes
Files saved with system.files.save land in the workspace uploads folder and come back with a URL usable by Image, PDF Viewer or Link.