> For the complete documentation index, see [llms.txt](https://docs.eximee.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.eximee.com/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/5-dokumenty-i-zaloczniki/zalaczniki-uploadfile.md).

# Attachments - UploadFile

Component for attaching files to the application

![](/files/36478221a956f1c14fe87830ef7c23db24828b5e)

## Component properties

<table><thead><tr><th>Eximee Designer property</th><th width="200.9832763671875">Attribute name in the Source</th><th>Description</th></tr></thead><tbody><tr><td><strong>Maximum number of attached files</strong> (section <strong>Basic properties</strong>)</td><td>numberOfUploadingFiles</td><td>The number of files that can be uploaded in the component, default is 1.</td></tr><tr><td><strong>Number of required attachments</strong> (section <strong>Data quality</strong>)</td><td>requiredCount</td><td>The required number of files to attach - default is 0. If 0, then no file needs to be attached; if more, then it depends on the given number.</td></tr><tr><td><strong>Text displayed when required attachments are missing</strong> (section <strong>Data quality</strong>)</td><td>requiredCountError</td><td>Requiredness message, required if the property <strong>Number of required attachments</strong> (requiredCount).</td></tr><tr><td><strong>Maximum file size</strong> (section <strong>Data quality</strong>)</td><td>maxFileSize</td><td>Maximum file size in KB. Default is 1024 KB.</td></tr><tr><td><strong>Maximum total size of all files</strong> (section <strong>Data quality</strong>)</td><td>maxTotalFilesSize</td><td>Maximum size of all attached files in KB. Default is 10240 KB.</td></tr><tr><td><strong>Show the list of available extensions</strong> (section <strong>Interactions</strong>)</td><td>showExtensionList</td><td>Enables the option to display information about allowed formats and the maximum size of the attached file (by default, the option is disabled). Example information: "Allowed attachment formats: pdf (max. 1 MB)"</td></tr><tr><td><strong>Enable image compression</strong> (section <strong>Interactions</strong>)</td><td>imageCompressionEnabled</td><td>Option to compress images (default value "false").</td></tr><tr><td><strong>Maximum width of a camera photo</strong> (section <strong>Interactions</strong>)</td><td>maxWebcamWidth</td><td>Feature availability depends on the license and may not be available in all deployments. Maximum width of a camera photo in pixels.</td></tr><tr><td><strong>Maximum height of a camera photo</strong> (section <strong>Interactions</strong>)</td><td>maxWebcamHeight</td><td>Feature availability depends on the license and may not be available in all deployments. Maximum height of a camera photo in pixels.</td></tr><tr><td><strong>Option to attach a photo taken with a camera</strong> (section <strong>Interactions</strong>)</td><td>webcamEnabledCondition</td><td>Feature availability depends on the license and may not be available in all deployments. Condition enabling/disabling the ability to upload a photo taken with the camera built into the device.</td></tr><tr><td><strong>List of allowed file extensions</strong> (section <strong>Security</strong>)</td><td>validExtensionList</td><td>Formats of allowed file extensions, separated by commas, e.g.: jpg, jpeg, png, pdf.</td></tr><tr><td><strong>Additional validation of PDF files</strong> (section <strong>Security</strong>)</td><td>validateContent</td><td>Additional validation of the file in terms of PDF FORMAT, not just the extension itself.</td></tr><tr><td><strong>Rejecting encrypted PDF, DOC, DOCX, XLS, XLSX files</strong> (section <strong>Security</strong>)</td><td>rejectEncrypted</td><td>Rejecting files (PDF, DOC, DOCX, XLS, XLSX) if they are password-encrypted.</td></tr><tr><td><strong>Regular expression for validating the file name</strong> (section <strong>Security</strong>)</td><td>allowedFilenameRegexp</td><td>Regular expression checking allowed file names. It is possible to override the default validation error message by adding the key <strong>iew.gwtupload.invalid_filename</strong> and setting a new translation value.</td></tr><tr><td><strong>Whitelist of characters</strong> (section <strong>Security</strong>)</td><td>extraWhitelistCharacters</td><td>To allow uploading files containing non-standard characters, add them to the whitelist of allowed characters. E.g.: (). This configuration extends the webforms.xml configuration ...</td></tr><tr><td><strong>Option to attach descriptions to attached files</strong> (section <strong>Other</strong>)</td><td>attachmentWithDescription</td><td>Feature availability depends on the license and may not be available in all deployments. Displays a description field for each added attachment. By default, the property is disabled (set to "false").</td></tr><tr><td><strong>Maximum number of characters in descriptions of attached files</strong> (section <strong>Other</strong>)</td><td>attachmentDescriptionMaxLength</td><td>Feature availability depends on the license and may not be available in all deployments. Maximum length of the description that can be entered for the added attachment. Default is 120 characters.</td></tr><tr><td><strong>Button label</strong> (section <strong>Other</strong>)</td><td>buttonLabel</td><td>Feature availability depends on the license and may not be available in all deployments. Text displayed on the add file button.</td></tr><tr><td><strong>Field description</strong> (section <strong>Other</strong>)</td><td>description</td><td>Feature availability depends on the license and may not be available in all deployments. Description text.</td></tr><tr><td><strong>Enable image compression</strong> (section <strong>Other</strong>)</td><td></td><td>Feature availability depends on the license and may not be available in all deployments. Property allowing attached images to be reduced.</td></tr><tr><td><strong>Document type - advanced integration</strong> (section <strong>Other</strong>)</td><td>documentType</td><td>Technical field used in advanced integration (requires additional implementation). Feature availability depends on the license and may not be available in all deployments.</td></tr><tr><td><strong>Contact number - advanced integration</strong> (section <strong>Other</strong>)</td><td>contractNumber</td><td>Technical field used in advanced integration (requires additional implementation). Feature availability depends on the license and may not be available in all deployments.</td></tr><tr><td><strong>Process type</strong> (section <strong>Other</strong>)</td><td>processType</td><td>Process name passed to the service saving the attached file in an external resource. Feature availability depends on the license and may not be available in all deployments.</td></tr><tr><td><strong>Calling an external validator for the added file</strong></td><td>singleFileValidator</td><td>Calling an external validator for the added file. The validator is called when attempting to add each file (if the attachment does not pass validation, it is rejected). The property should be added from the XML Source level.</td></tr></tbody></table>

> More information about component properties: [Common component properties](/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/praca-z-komponentami-bazowymi/wspolne-wlasciwosci-komponentow.md)

## Using the component

{% stepper %}
{% step %}
**Adding a file**

To import a file using the component **Attachments**, click the button **Add file**. The system file selection window will then open. After selecting a file, it will be imported. After the import is complete, the file name will appear on the list.
{% endstep %}

{% step %}
**Deleting a file**

Imported files can be deleted by clicking the button **Delete** visible next to the file name.
{% endstep %}
{% endstepper %}

![Figure 1. Example appearance of the component on the application](/files/001f9830ece7f9c65b2b2cebf108defc1018bc19)

![Figure 2. Example appearance of the component with an uploaded attachment](/files/b20a99a557c723a57a599dfd76cc4ca274004ec1)

{% hint style="info" %}
To the component **Attachments** you can attach a file with any extension.
{% endhint %}

## Description for attached files

{% hint style="info" %}
Availability of functionality depends on the license and may not be available in all deployments.
{% endhint %}

A description can be added to the attached file. To do this, select the field **Option to attach descriptions to attached files** (attachmentWithDescription) (by default, the field is disabled). The length of the added description can be set in the field **Maximum number of characters in descriptions of attached files** (attachmentDescriptionMaxLength).

## Component input parameters

| Property               | Description                                         |
| ---------------------- | --------------------------------------------------- |
| **maxFileSize**        | Maximum file size in bytes                          |
| **validExtensionList** | List of allowed extensions (one extension per line) |
| **maxWebcamWidth**     | Maximum width of a camera photo in pixels           |
| **maxWebcamHeight**    | Maximum height of a camera photo in pixels          |

## Component output parameters

| Property           | Description                                                                                                           |
| ------------------ | --------------------------------------------------------------------------------------------------------------------- |
| **totalFilesSize** | Sum of the sizes of all files added using the uploader component                                                      |
| **fileNames**      | Retrieving the names of files added to the control. Data is returned in JSON format: \["fileName1", "fileName2", ...] |
| **externalIds**    | File identifiers from the external service, similarly to above, are returned in JSON format.                          |

If we want to display the sum of the sizes of all files in a component, e.g. a Text field, we can do so using the property **DATA SOURCE FROM ANOTHER FIELD** (valueSourceId) of the component that is to display the value. For this purpose, the property **DATA SOURCE FROM ANOTHER FIELD** we assign the following value: `GesUploadFile1$totalFilesSize` where `GesUploadFile1` is the identifier of the attachment component, while `totalFilesSize` is a property of this component whose value will be entered. Copying the value additionally requires listening to the attachment component.

## Defining a component clearing action

For the component, it is possible to define in the main application template an action clearing the attached file from the component. More information in [Actions](/documentation/documentation-en/budowanie-aplikacji/logika-biznesowa/przeplywy/akcje.md).

{% hint style="info" %}
Demo application: demoUploadFile
{% endhint %}

{% hint style="info" %}
♿WCAG: [Good WCAG practices for low-code dev](/documentation/documentation-en/budowanie-aplikacji/proces-biznesowy/tworzenie-procesu-biznesowego-w-bpmn-2.0/dobre-praktyki.md)
{% endhint %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.eximee.com/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/5-dokumenty-i-zaloczniki/zalaczniki-uploadfile.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.