# Multi File Uploader

> You can select and upload multiple files using the **Multi File Uploader** control, which sets the value as an `IResource` list.

You can select and upload multiple files using the **Multi File Uploader** control, which sets the value as an `IResource` list.

:::note
Public Apps do not support the **Multi File Uploader** control.
:::

## Working with IResource

If you obtain a file as an `ILocalResource`, it is automatically converted into an `IResource` using:
```
JobAttachment.fromResource(file) // file is an ILocalResource
```

:::important
The following functions have been deprecated and you should no longer use them:
* `.toLocalResource`
* `.toAppsFile`
:::

## General

* **Max file size** - The maximum file size of each file you can upload. The recommended maximum file size is 10 MB.

    :::note
    You can upload a maximum of 10 files.
    :::

* **Allowed file types** - The file types you can upload. Use a comma `,` to separate file extensions. For example, if you write `.jpg`, `.png`, `.svg`, you can only upload these file types. The dot `.` symbol is not mandatory when listing the file types.
* **Helper text** - The help text to be displayed at runtime.
* **Tooltip** - The text to be displayed when an app user hovers over the control. Use this to provide additional information on the control.
* **Label** - The display text of the control.
* **Required** - If set to true, app users must provide data in the control. To mark the control as mandatory at runtime, an asterisk (*) is added after the label text.
* **Custom error message** - The text to be displayed if the **Required** property is set to true and the control is left empty.
* **Hidden** - If set to true, hides the control at runtime.
## Events
* **Value Changed** - Configure what happens when a file is added or removed from the selection.

## Style

* **Control Alignment** - By default, inherits the parent alignment. A different alignment other than the parent can be set. To default back to the parent alignment, deselect the overridden options.

:::note
The alignment is dependent on the layout selected for the parent, such as **Vertical** or **Horizontal**.
:::

* **Label Placement** - By default, the label is displayed on top of the control, aligned to the left. You can place it to the left of the control on the same line. The **Label Width** property configures how wide the label should be, and the **Space between** property sets the distance between the label and the control.
* **Font** - The font attributes for both the label and the input text, such as font family, size, color, or style, such as bold, italic, and underline. By default, the control inherits the font family of the immediate parent container, indicated by the keyword **Inherited**.
* **Margin** - The margin of the control. By default, a margin of 4px is set. **Top/Bottom** and **Left/Right** margin properties are combined. These properties can be detached using the **Link** button on the right side of the **Margin** section.
* **Size** - The width and height of the control. By default, the size is set to `auto`. To set minimum or maximum values, select the three-dot icon `(...)`.

## VB properties

| VB property              | Data type | Description |
|--------------------------|-----------|-------------|
| `Tooltip`                | String    | Information text which appears when the user hovers over the **File Uploader**. |
| `Label`                  | String    | The label of the **File Uploader**, typically text displayed preceding the control. |
| `Value`                  | IResource | Name of the currently uploaded file. |
| `Required`               | Boolean   | Specifies if the file upload is mandatory. |
| `RequiredErrorMessage`   | String    | Message displayed when the file upload is required, but was not provided. |
| `Hidden`                 | Boolean   | Determines the visibility of the **File Uploader** control. If set to true, hides the control at runtime. |
| `Disabled`               | Boolean   | Determines if the **File Uploader** control is interactable. If set to true, disables interaction with the **File Uploader** at runtime. |
| `IsValid`                | Boolean   | Checks validity of the **File Uploader** value. If true, indicates it is valid. |

## Using the File Uploader

This example shows how you can use the **Multi File Uploader** with a storage bucket:
1. Open an existing app, or create a new one.
  * Add a **Multi File Uploader** control.
  * Select **Events**. In **Value Changed**, select **Define automation**.
2. Add a **For Each** activity that iterates over the file selection.
   * You can use the expression `Controls.MainPage.MultiFileUploader.Value`.
   * Add an **Upload Storage File** activity in **For Each**.
      * Specify the Orchestrator folder path and the storage bucket name.
      * In the **File** field, select the expression `currentIResource`.
      * In the **Where to upload** field, select the expression `currentIResource.FullName`.
3. Test or run your app.

When you run the app and add multiple files in the **Multi File Uploader**, the app uploads the storage file to the storage bucket.