FileUploadField component allows you to upload a file and save it to an entity attribute as a byte array.

The component can contain a caption, a link to the uploaded file, and an upload button. When the upload button is clicked, a standard OS file picker window is shown, where the user can select a file.

file upload field

Component’s XML-name: fileUpload.


In the example below, the document attribute of the Person entity has the byte array type.

@Table(name = "UIEX1_PERSON")
@Entity(name = "uiex1_Person")
public class Person {

    /* other attributes */

    @Column(name = "DOCUMENT")
    private byte[] document;
    <instance id="personDc"
        <fetchPlan extends="_base"/>
<layout spacing="true">
    <form id="form" dataContainer="personDc">
        <column width="350px">
            <textField id="nameField"

            <fileUpload id="documentField"
                        property="document" />

To store the file in the file storage and link to the entity as FileRef, use the FileStorageUploadField component.


  • Attributes - FileUploadField has the same attributes as the FileStorageUploadField component, except fileStorage and fileStoragePutMode.

  • Methods - FileUploadField has the same methods as the FileStorageUploadField component, except getFileId().

  • Listeners - FileUploadField has the same listeners as the FileStorageUploadField component.