The File Upload widget allows users to upload one or multiple files to a ThingWorx repository. You can configure the widget to upload files in one of the following ways:

In addition, you can configure validation rules to apply restrictions on the file type, size, amount, and more.

Drag and Drop

When you drag or select a file in this mode, files are instantly uploaded or listed, based on the value of the DisableInstantUpload property. Optionally, you can disable the AllowInstantUpload property and upload files manually using a button or the widget Upload service. In addition, a Replace button is displayed that enables you to replace an uploaded file on the repository.

Browse Button Only

By default, selected files are automatically uploaded to the repository. A progress bar is displayed to indicate the upload the progress for each file.

To allow users to review the selected files before uploading, set the widget DisbaleInstantUpload and ShowUploadButton properties to true. At run time, users can start the upload by clicking the Upload button. Optionally, bind a mashup, function, or widget event to the widget Upload service to start the upload based on a specific condition.

You can add a delete button to enable users to stop the upload and remove the selected files from the list. Uploaded files are only removed from the list and are not deleted from the ThingWorx Repository. To delete files from the repository, use a custom data service.

By default, users can use the available controls to select a repository and a folder to upload files to. To prevent users from choosing a repository or a folder path, set the ShowRepositoryPath and ShowRepositorySelector properties to false. You can specify the default repository name and folder using the widget RepositoryName and Path properties. For more information about repositories in the platform, see Managing File Repositories.

By default, users can upload files of any size at run time. You can limit the maximum file size that is available for upload using the widget MaxFileSize property on the Validation panel. To customize the failure messages when a file is larger than the allowed maximum, configure the MaxFileSizeFailureMessage and MaxFileSizeFailureTitle properties.

You can use the MaxUploadSize validation property to restrict the size of total upload. A failure message is displayed when the total upload size exceeds the limit. To customize the error message, use the MaxUploadSizeFailureMessage and MaxUploadSizeFailureTitle properties.

You can limit the maximum number of files that users can upload using the widget MaxFileSize property on the Validation panel. When the selected number of files is higher than the maximum, a failure message is displayed. To customize the error message, use the MaxNumberOfFilesFailureMessage property.

You can configure the widget to accept specific file formats using the AllowedFileTypes property. You can add multiple file types, separated by a comma. For example, type: .pdf, .png to allow PDF and PNG files only. Use the AllowedFileTypesMessage and AllowedFileTypesTitle properties to customize the error message that is displayed when an unsupported file type is added.

You can drag files to the drop zone area or click the label to open a file selection dialog box. The zone color automatically changes to indicate that you can drop files.

You can use the following properties to configure the drop zone:

The following table lists properties that are available on the Properties panel.

Unlike other widgets that support validation, the File Upload does not support validation and criteria messages. You can define a criteria message and enable ShowFailureMessage to display a failure message when the ValidationState is Invalid.

For more information about using the common validation properties, see Text Field Widget (Themable).

The following table lists validation properties that are available on the Validation panel.