New to Kendo UI for AngularStart a free 30-day trial

UploadComponent

Represents the Kendo UI Upload component for Angular.

html
<kendo-upload
   [saveUrl]="uploadSaveUrl" 
   [removeUrl]="uploadRemoveUrl"> 
</kendo-upload>

Selector

kendo-upload

Export Name

Accessible in templates as #kendoUploadInstance="kendoUpload"

Inputs

NameTypeDefaultDescription

accept

string

Sets the accept attribute of the internal input element of the component.

actionsLayout

ActionsLayout

'end'

Specifies the layout of the action buttons.

autoUpload

boolean

true

Specifies whether selected files upload automatically (see example). Set autoUpload to false to change this behavior.

batch

boolean

false

Specifies whether all files in the selection upload in a single request (see example). Files selected one after the other upload in separate requests.

chunkable

boolean | ChunkSettings

false

Specifies whether the chunk functionality of the Upload is enabled.

concurrent

boolean

true

Specifies whether selected files upload simultaneously or one by one.

disabled

boolean

false

Disables the component.

multiple

boolean

true

Allows you to select multiple files. When you set this to false, you can select only one file at a time.

removeField

string

Specifies the FormData key which contains the list of file names submitted to removeUrl.

removeHeaders

HttpHeaders

Specifies the HttpHeaders attached to each remove request.

removeMethod

string

Specifies the RequestMethod of the remove request.

removeUrl

string

Specifies the URL of the endpoint for the remove request. The FormData request key uses the name from the removeField property. This key contains the list of file names to be removed.

responseType

"text" | "arraybuffer" | "blob" | "json"

'json'

Specifies the expected response type of the server. The response type determines how the response is parsed.

restrictions

FileRestrictions

Sets the restrictions for selected files.

saveField

string

Specifies the FormData key which contains the files submitted to saveUrl.

saveHeaders

HttpHeaders

Specifies the HttpHeaders attached to each upload request.

saveMethod

string

Specifies the RequestMethod of the upload request.

saveUrl

string

Specifies the URL of the endpoint for the upload request. The request FormData key uses the name from the saveField property. This key contains the list of files to be uploaded.

showFileList

boolean

true

Specifies whether the file list is visible.

tabindex

number

0

Sets the tabindex of the component.

withCredentials

boolean

true

Specifies whether credentials (cookies, headers) are sent for cross-site requests (see example). Set withCredentials has no effect on same-site requests. Use the saveHeaders or removeHeaders property to add credentials to the request. You can also use the upload event.

zoneId

string

Sets the id of the external drop zone that you want to associate with the component.

Events

NameTypeDescription

cancel

EventEmitter<CancelEvent>

Fires when the upload is canceled while in progress.

clear

EventEmitter<ClearEvent>

Fires when the file list is about to be cleared. Prevent this event to keep the files in the list.

complete

EventEmitter<any>

Fires when all active uploads complete successfully or with errors.

error

EventEmitter<ErrorEvent>

Fires when an upload or remove operation fails.

blur

EventEmitter<any>

Fires when you navigate outside the component.

focus

EventEmitter<any>

Fires when you focus the component.

pause

EventEmitter<any>

Fires when the upload of a file is paused.

remove

EventEmitter<RemoveEvent>

Fires when you are about to remove a file. If you prevent this event, the file will remain in the list.

resume

EventEmitter<any>

Fires when the upload of a file is resumed.

select

EventEmitter<SelectEvent>

Fires when you select files. If you prevent this event, the component will not add the selected files to the list.

success

EventEmitter<SuccessEvent>

Fires when an upload or remove operation completes successfully.

upload

EventEmitter<UploadEvent>

Fires when one or more files are about to be uploaded. Prevent this event to stop the files from uploading and being added to the file list.

uploadProgress

EventEmitter<UploadProgressEvent>

Fires when one or more files are uploading.

valueChange

EventEmitter<FileInfo[]>

Fires when the component value changes after a successful upload, remove, or clear operation.

Methods

blur

Blurs the component if you previously focused it.

cancelUploadByUid

Cancels the upload of a file or a batch of files.

Parameters

uid

string

The uid of the file or a batch of files that will be canceled.

clearFiles

Clears all files from the UI without sending requests to the remove handler.

focus

Focuses the component's Select files button.

pauseFileByUid

Pauses the upload process of a file that is currently uploading. This method requires the chunkable option of the Upload to be enabled.

Parameters

uid

string

The uid of the file that will be paused.

removeFilesByUid

Removes a file or a batch of files.

Parameters

uid

string

The uid of the file or a batch of files that will be removed.

resumeFileByUid

Resumes the upload process for a file that was previously paused. This method requires the chunkable option of the Upload to be enabled.

Parameters

uid

string

The uid of the file that will be resumed.

retryUploadByUid

Retries the upload of a file or batch of files that failed to upload.

Parameters

uid

string

The uid of the file or a batch of files to be retried.

uploadFiles

Uploads the currently selected files that pass the set restrictions.

In this article
SelectorExport NameInputsEventsMethods
Not finding the help you need?
Contact Support