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

UploadProps

Interface

Represents the props of the Kendo Ui for Vue Upload component.

Definition

Package:@progress/kendo-vue-upload

Properties

accept?

string

Sets the accept attribute of the input element of the Upload.

Specifies the possible layouts of the action buttons (see example). Defaults to end.

Identifies the element(s) which will describe the component, similar to HTML aria-describedby attribute For example these elements could contain error or hint message.

Identifies the element(s) which will label the component.

By default, the selected files are immediately uploaded. To change this behavior, set autoUpload to false.

batch?

boolean

When enabled, all files in the selection are uploaded in one request. Any files that are selected one after the other are uploaded in separate requests.

Sets a class of the Upload DOM element.

The initial list of files which are displayed when the Upload is in uncontrolled mode (see example).

disabled?

boolean

Disables the Upload (see example). Defaults to false.

The list of files which are displayed when the Upload is in controlled mode (see example).

id?

string

Specifies the id of the component.

The component that will be rendered as a list item inside the Upload.

multiple?

boolean

Enables the selection of multiple files (see example). If set to false, only one file can be selected at a time.

onAdd?

(event: UploadOnAddEvent) => void

Fires when new files are selected for upload.

Parameters:eventUploadOnAddEvent

Fires before a request for a file removal is made. Can be used to add extra data to the request.

Fires before a request for a file upload is made. Can be used to add extra data to the request.

Fires when user clicks on the Remove button while the file upload is in progress. Can be used when the saveUrl option is set to a function that cancels custom requests.

Parameters:eventUploadOnCancelEvent

Fires when the progress of the file upload is changed.

Parameters:eventUploadOnProgressEvent

Fires when files are removed. Optionally, if a request is made, can contain a server response.

Parameters:eventUploadOnRemoveEvent

Fires when the status of the files is changed. Optionally, if a request is made, can contain a server response.

Sets the FormData key which contains the list of file names that are submitted to removeUrl. Defaults to fileNames.

Configures the HttpHeaders that are attached to each remove request.

Sets the request method of the remove request. Defaults to POST.

removeUrl?

string | (files: UploadFileInfo[], options: { formData: FormData; requestOptions: any }) => Promise​<{ uid: string }>

Sets the URL of the endpoint for the remove request. The FormData request key is named after the removeField property. It contains the list of file names which will be removed.

responseType?

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

Sets the expected response type of the server. Used to parse the response appropriately. Defaults to json.

Sets the restrictions for the selected files (see example).

Sets the FormData key which contains the files submitted to saveUrl. Defaults to files.

Configures the HttpHeaders that are attached to each upload request.

Sets the request method of the upload request. Defaults to POST.

saveUrl?

string | (files: UploadFileInfo[], options: { formData: FormData; requestOptions: any }, onProgress: (uid: string, event: ProgressEvent​<EventTarget>) => void) => Promise​<{ uid: string }>

Sets the URL of the endpoint for the upload request. The requested FormData key is named after the saveField property and contains the list of files that will be uploaded.

When the autoUpload option is set to false, showActionButtons toggles the visibility of the action buttons which are rendered.

Toggles the visibility of the file list.

tabIndex?

string | number

Specifies the tabindex of the Upload.

Sets the custom restrictions for the selected files (see example).

Parameters:fileUploadFileInfo

Configures whether credentials (cookies, headers) will be sent for cross-site requests. Defaults to true. Setting withCredentials has no effect on same-site requests. To add credentials to the request, use the saveHeaders or removeHeaders property.