/** * DevExtreme (ui/file_uploader.d.ts) * Version: 21.1.7 * Build date: Thu Aug 07 2025 * * Copyright (c) 2012 - 2025 Developer Express Inc. ALL RIGHTS RESERVED * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/ */ import { UserDefinedElement, DxElement, } from '../core/element'; import { EventInfo, NativeEventInfo, InitializedEventInfo, ChangedOptionInfo, } from '../events/index'; import Editor, { EditorOptions, } from './editor/editor'; import UploadInfo from '../file_management/upload_info'; /** @public */ export type BeforeSendEvent = EventInfo & { readonly request: XMLHttpRequest; readonly file: File; readonly uploadInfo?: UploadInfo; }; /** @public */ export type ContentReadyEvent = EventInfo; /** @public */ export type DisposingEvent = EventInfo; /** @public */ export type DropZoneEnterEvent = NativeEventInfo & { readonly dropZoneElement: DxElement; }; /** @public */ export type DropZoneLeaveEvent = NativeEventInfo & { readonly dropZoneElement: DxElement; }; /** @public */ export type FilesUploadedEvent = EventInfo; /** @public */ export type InitializedEvent = InitializedEventInfo; /** @public */ export type OptionChangedEvent = EventInfo & ChangedOptionInfo; /** @public */ export type ProgressEvent = NativeEventInfo & { readonly file: File; readonly segmentSize: number; readonly bytesLoaded: number; readonly bytesTotal: number; readonly request: XMLHttpRequest; }; /** @public */ export type UploadAbortedEvent = NativeEventInfo & { readonly file: File; readonly request: XMLHttpRequest; message: string; }; /** @public */ export type UploadedEvent = NativeEventInfo & { readonly file: File; readonly request: XMLHttpRequest; message: string; }; /** @public */ export type UploadErrorEvent = NativeEventInfo & { readonly file: File; readonly request: XMLHttpRequest; readonly error: any; message: string; }; /** @public */ export type UploadStartedEvent = NativeEventInfo & { readonly file: File; readonly request: XMLHttpRequest; }; /** @public */ export type ValueChangedEvent = NativeEventInfo & { readonly value?: Array; readonly previousValue?: Array; }; /** * @deprecated use Properties instead * @namespace DevExpress.ui */ export interface dxFileUploaderOptions extends EditorOptions { /** * @docid * @type_function_param2 uploadInfo?:UploadInfo * @type_function_return Promise|any * @public */ abortUpload?: ((file: File, uploadInfo?: UploadInfo) => PromiseLike | any); /** * @docid * @default "" * @public */ accept?: string; /** * @docid * @default true * @public */ allowCanceling?: boolean; /** * @docid * @default [] * @public */ allowedFileExtensions?: Array; /** * @docid * @default 0 * @public */ chunkSize?: number; /** * @docid * @default true &for(desktop) * @public */ focusStateEnabled?: boolean; /** * @docid * @default true * @public */ hoverStateEnabled?: boolean; /** * @docid * @default "File type is not allowed" * @public */ invalidFileExtensionMessage?: string; /** * @docid * @default "File is too large" * @public */ invalidMaxFileSizeMessage?: string; /** * @docid * @default "File is too small" * @public */ invalidMinFileSizeMessage?: string; /** * @docid * @default {} * @public */ inputAttr?: any; /** * @docid * @default "or Drop file here" * @default "" &for(InternetExplorer|desktop) * @public */ labelText?: string; /** * @docid * @default 0 * @public */ maxFileSize?: number; /** * @docid * @default 0 * @public */ minFileSize?: number; /** * @docid * @default false * @public */ multiple?: boolean; /** * @docid * @default "files[]" * @public */ name?: string; /** * @docid * @default null * @type_function_param1 e:object * @type_function_param1_field1 component:dxFileUploader * @type_function_param1_field2 element:DxElement * @type_function_param1_field3 model:any * @type_function_param1_field4 request: XMLHttpRequest * @type_function_param1_field5 file:File * @type_function_param1_field6 uploadInfo:UploadInfo * @action * @public */ onBeforeSend?: ((e: BeforeSendEvent) => void); /** * @docid * @default null * @type_function_param1 e:object * @type_function_param1_field1 component:dxFileUploader * @type_function_param1_field2 element:DxElement * @type_function_param1_field3 model:any * @type_function_param1_field4 dropZoneElement:DxElement * @type_function_param1_field5 event:event * @action * @public */ onDropZoneEnter?: ((e: DropZoneEnterEvent) => void); /** * @docid * @default null * @type_function_param1 e:object * @type_function_param1_field1 component:dxFileUploader * @type_function_param1_field2 element:DxElement * @type_function_param1_field3 model:any * @type_function_param1_field4 dropZoneElement:DxElement * @type_function_param1_field5 event:event * @action * @public */ onDropZoneLeave?: ((e: DropZoneLeaveEvent) => void); /** * @docid * @default null * @type_function_param1 e:object * @type_function_param1_field1 component:dxFileUploader * @type_function_param1_field2 element:DxElement * @type_function_param1_field3 model:any * @action * @public */ onFilesUploaded?: ((e: FilesUploadedEvent) => void); /** * @docid * @default null * @type_function_param1 e:object * @type_function_param1_field1 component:dxFileUploader * @type_function_param1_field2 element:DxElement * @type_function_param1_field3 model:any * @type_function_param1_field4 file:File * @type_function_param1_field5 segmentSize:Number * @type_function_param1_field6 bytesLoaded:Number * @type_function_param1_field7 bytesTotal:Number * @type_function_param1_field8 event:event * @type_function_param1_field9 request:XMLHttpRequest * @action * @public */ onProgress?: ((e: ProgressEvent) => void); /** * @docid * @default null * @type_function_param1 e:object * @type_function_param1_field1 component:dxFileUploader * @type_function_param1_field2 element:DxElement * @type_function_param1_field3 model:any * @type_function_param1_field4 file:File * @type_function_param1_field5 event:event * @type_function_param1_field6 request:XMLHttpRequest * @type_function_param1_field7 message:string * @action * @public */ onUploadAborted?: ((e: UploadAbortedEvent) => void); /** * @docid * @default null * @type_function_param1 e:object * @type_function_param1_field1 component:dxFileUploader * @type_function_param1_field2 element:DxElement * @type_function_param1_field3 model:any * @type_function_param1_field4 file:File * @type_function_param1_field5 event:event * @type_function_param1_field6 request:XMLHttpRequest * @type_function_param1_field7 error:any * @type_function_param1_field8 message:string * @action * @public */ onUploadError?: ((e: UploadErrorEvent) => void); /** * @docid * @default null * @type_function_param1 e:object * @type_function_param1_field1 component:dxFileUploader * @type_function_param1_field2 element:DxElement * @type_function_param1_field3 model:any * @type_function_param1_field4 file:File * @type_function_param1_field5 event:event * @type_function_param1_field6 request:XMLHttpRequest * @action * @public */ onUploadStarted?: ((e: UploadStartedEvent) => void); /** * @docid * @default null * @type_function_param1 e:object * @type_function_param1_field1 component:dxFileUploader * @type_function_param1_field2 element:DxElement * @type_function_param1_field3 model:any * @type_function_param1_field4 file:File * @type_function_param1_field5 event:event * @type_function_param1_field6 request:XMLHttpRequest * @type_function_param1_field7 message:string * @action * @public */ onUploaded?: ((e: UploadedEvent) => void); /** * @docid * @default null * @type_function_param1 e:object * @type_function_param1_field1 component:dxFileUploader * @type_function_param1_field2 element:DxElement * @type_function_param1_field3 model:any * @type_function_param1_field4 value:Array * @type_function_param1_field5 previousValue:Array * @type_function_param1_field6 event:event * @action * @public */ onValueChanged?: ((e: ValueChangedEvent) => void); /** * @docid * @default 0 * @public */ progress?: number; /** * @docid * @default "Ready to upload" * @public */ readyToUploadMessage?: string; /** * @docid * @default "Select File" * @public */ selectButtonText?: string; /** * @docid * @default true * @public */ showFileList?: boolean; /** * @docid * @default undefined * @public */ dialogTrigger?: string | UserDefinedElement; /** * @docid * @default undefined * @public */ dropZone?: string | UserDefinedElement; /** * @docid * @default "Upload" * @public */ uploadButtonText?: string; /** * @docid * @type_function_return Promise|any * @public */ uploadChunk?: ((file: File, uploadInfo: UploadInfo) => PromiseLike | any); /** * @docid * @default "Upload failed" * @public */ uploadFailedMessage?: string; /** * @docid * @default "Upload cancelled" * @public */ uploadAbortedMessage?: string; /** * @docid * @type_function_return Promise|any * @public */ uploadFile?: ((file: File, progressCallback: Function) => PromiseLike | any); /** * @docid * @default {} * @public */ uploadHeaders?: any; /** * @docid * @default {} * @public */ uploadCustomData?: any; /** * @docid * @type Enums.UploadHttpMethod * @default "POST" * @public */ uploadMethod?: 'POST' | 'PUT'; /** * @docid * @type Enums.FileUploadMode * @default "instantly" * @public */ uploadMode?: 'instantly' | 'useButtons' | 'useForm'; /** * @docid * @default "/" * @public */ uploadUrl?: string; /** * @docid * @default "Uploaded" * @public */ uploadedMessage?: string; /** * @docid * @default [] * @public */ value?: Array; } /** * @docid * @inherits Editor * @namespace DevExpress.ui * @public */ export default class dxFileUploader extends Editor { constructor(element: UserDefinedElement, options?: dxFileUploaderOptions) /** * @docid * @publicName upload() * @public */ upload(): void; /** * @docid * @publicName upload(fileIndex) * @public */ upload(fileIndex: number): void; /** * @docid * @publicName upload(file) * @public */ upload(file: File): void; /** * @docid * @publicName abortUpload() * @public */ abortUpload(): void; /** * @docid * @publicName abortUpload(fileIndex) * @public */ abortUpload(fileIndex: number): void; /** * @docid * @publicName abortUpload(file) * @public */ abortUpload(file: File): void; /** * @docid * @publicName removeFile(fileIndex) * @public */ removeFile(fileIndex: number): void; /** * @docid * @publicName removeFile(file) * @public */ removeFile(file: File): void; } /** @public */ export type Properties = dxFileUploaderOptions; /** @deprecated use Properties instead */ export type Options = dxFileUploaderOptions; /** @deprecated use Properties instead */ export type IOptions = dxFileUploaderOptions;