MultiFile Upload

(part of package 'Servoy Extra Components') Extends designtime/SolutionModel: JSWebComponent Extends runtime: RuntimeWebComponent

This is a reference page; many components have detailed usage guides here.

Properties

allowMultipleUploads

Should not be used together with closeAfterFinish (so both properties to be true)

Type: boolean Default Value: true

---

autoProceed

By default the component will wait for an upload button to be pressed in the UI, or the upload() method to be called, before starting an upload. Setting this to autoProceed: true will start uploading automatically after the first file is selected.

Type: boolean Default Value: false

---

closeAfterFinish

Whether to automatically close the modal when all current uploads are complete. If this is set, allowMultipleUploads and inline properties ahould be false.

Type: boolean Default Value: false

---

disableStatusBar

Whether to show upload progress and pause/resume/cancel buttons.

Type: boolean Default Value: false

---

hideUploadButton

Hide the upload button. Use this if you are providing a custom upload button somewhere, and using the upload() API.

Type: boolean Default Value: false

---

inline

When false, the component does not show on the form, but in a modal that is shown when openModal() is called. Should not be used together with closeAfterFinish (so both properties to be true)

Type: boolean Default Value: true

---

language

One of the language packs shipped. If you need to provide your own translations, use the localeStrings property.

Type: string Default Value: null

---

localeStrings

Any number of key/value pairs to translate single strings in the component, overriding the ones provided by the language pack selected.

Type: map

---

metaFields

An array of UI field objects that will be shown when a user clicks the 'edit' button on that file

Type: metaField[]

---

note

Type: tagstring

---

options

Type: map

---

responsiveHeight

Height (in pixels) to be set in a responsive form. When responsiveSize is set to 0, the component will use some default height value (450px).

Type: int Default Value: 0

---

responsiveWidth

Width to be set in a responsive form. When responsiveWidth is set to 0, the component will use some default width value (290px). Can be a number (in pixels) or a percent.

Type: string Default Value: "0"

---

restrictions

Provide rules and conditions to limit the type and/or number of files that can be selected.

Type: uploadRestriction

---

sources

Allows to add additional sources of files (other than the user's file system)

Type: string[]

---

tusOptions

Look at the Uppy TUS options what you can set here like chunkSize: nrOfBytes

Type: map

---

visible

Type: visible Default Value: true

---

webcamOptions

Look at the Uppy webcam plugin options what you can set here like showVideoSourceDropdown

Type: json Default Value: {"target":"Dashboard","showVideoSourceDropdown":true}

---

Events

onBeforeFileAdded

Parameters:

fileToAdd uploadFile files uploadFile[] event JSEvent

Returns: boolean

---

onFileAdded

Parameters:

fileAdded uploadFile event JSEvent

---

onFileRemoved

Parameters:

fileRemoved uploadFile event JSEvent

---

onFileUploaded

Parameters:

jsUpload JSUpload event JSEvent

---

onModalClosed

---

onModalOpened

---

onRestrictionFailed

Parameters:

file uploadFile error string event JSEvent

---

onUploadComplete

Parameters:

successfulFiles uploadFile[] failedFiles uploadFile[] event JSEvent

---

API

cancelAll

Cancel all uploads, reset progress and remove all files.

---

closeModal

Close the modal window

---

getFile

Get a specific file object by its ID

@param {String} fileID @return {CustomType<servoyextra-multifileupload.uploadFile>}

Parameters:

fileID string

Returns: uploadFile

---

getFiles

Get an array of all file objects in the component

@return {Array<CustomType<servoyextra-multifileupload.uploadFile>>}

Returns: uploadFile[]

---

info

Sets a message in state, with optional details

@param {String|{message: String, details: String}} message @param {String} [type] info, warning, success or error (defaults to info) @param {Number} [duration] the duration in milliseconds (defaults to 3000)

Parameters:

message object type string duration int

---

initialize

(Re-)initializes the component

---

openModal

Open the modal window

---

removeFile

Remove a file from the component

@param {String} fileID

Parameters:

fileID string

---

reset

Stop all uploads in progress and clear file selection, set progress to 0. Basically, return things to the way they were before any user input.

---

retryAll

Retry all uploads (after an error, for example)

---

retryUpload

Retry an upload (after an error, for example).

@param {String} fileID

Parameters:

fileID string

---

upload

Start uploading selected files.

---

Types

metaField

scripting type: CustomType<servoyextra-multifileupload.metaField>

• id

  • Type: string

• name

  • Type: string

• placeholder

  • Type: tagstring

progress

scripting type: CustomType<servoyextra-multifileupload.progress>

• bytesTotal

  • Type: int

• bytesUploaded

  • Type: int

• percentage

  • Type: int

• uploadComplete

  • Type: boolean

• uploadStarted

  • Type: int

uploadFile

scripting type: CustomType<servoyextra-multifileupload.uploadFile>

• error

  • Type: string

• extension

  • Type: string

• id

  • Type: string

• metaFields

  • Type: object

• name

  • Type: string

• progress

  • Type: progress

• type

  • Type: string

uploadRestriction

scripting type: CustomType<servoyextra-multifileupload.uploadRestriction>

• allowedFileTypes

  • Type: string[]

• maxFileSize

  • Type: long

  • Default Value: null

• maxNumberOfFiles

  • Type: int

  • Default Value: null

• minNumberOfFiles

  • Type: int

  • Default Value: null

---