The Upload Element displays a <input type="file"> HTML element wrapped with a UIkit Custom Control, use it to allow users uploading one or more files from their device.
Settings
It inherits common settings with the following specifics:
Setting
Description
Dynamic
Upload to
The server path where the file will be uploaded to.
✓
Filename
An optional filename to rename the uploaded file with.
✓
Allow multiple
Should be allowed to upload multiple files simultaneously.
Avoid collisions
Should the uploaded filename be renamed in the case of a name conflict with a pre-existing file. The new name will be the original name appended with _{n}, being n a sequential number.
Common Settings
Setting
Description
Dynamic
Label
The title for the field that represents the field data.
✓
Control
The name that identifies the field control within the form. It's required and must be unique for the Form Area.
Value
The efault value for the field. The user can change it.
✓
Readonly
Should the field be read-only. Any default value will be unedible.
Autofocus
Should the field will be autofocused as soon as the page loads. Only one field can be focused on each page.
Sync ID / Control
Should the field ID attribute obtain it value from the Control Name.
Display
Setting
Description
Display
The combination of HTML elements to show, Button & Input, Button, Link, or Native.
Text
The text for the button or link, if those are displayed.
Upload Input
Setting
Description
Icon
The name of the Icon that will be displayed inside the input field.
Icon Alignment
The side of the field where the icon will be aligned, Left or Right.
Upload Button
Setting
Description
Full Width
Should the button occupy the full width of its parent.
Icon
The name of the Icon that will be displayed inside the input field.
Icon Alignment
The side of the button where the icon will be aligned, Left or Right.
Validation
It inherits common validation with the following specifics:
Validation
Description
Dynamic
Browser Side
Server Side
Mime Types
The comma-separated list of mime types that the uploaded files must constrain to, e.g. image/png, video/*.
✓
✓
✓
Extensions
The comma-separated list of file extensions that the uploaded files must constrain to, e.g. png, jpg, gif.
✓
✓
✓
Min File Size
The minimum size that the uploaded files must constrain to, greater than or equal to, using any standard size unit B, KB, MB, GB, TB, PB, EB, ZB, or YB.
✓
✓
Max File Size
The maximum size that the uploaded files must constrain to, lower than or equal to, using the same size units as Min File Size.
✓
✓
Common Validation
Validation
Description
Dynamic
Browser Side
Server Side
Required
Defines if the field must have a value.
✓
✓
✓
Error Message
A message that will be displayed if the element validation fails. Optionally use {fieldlabel} as placeholder, it will be replaced with the field label.
✓
✓
Integration
Access a Builder layout and create a Form Area.
Add an Upload Element from the Form Essentials group.
Access the element settings and input a Control Name.
