Vue FileManager - Custom.Configuration

This section describes properties that configure a custom file system provider.

abortFileUpload

A function that cancels the file upload.

Type:

Function

Function parameters:
file:

File

The file that is being uploaded.

uploadInfo:

UploadInfo

Information about the file upload session.

destinationDirectory:

FileSystemItem

The directory where a file system item is uploaded to.

Return Value:

Promise<any> (jQuery or native)

| any

A Promise that is resolved after the file upload in aborted. It is a native Promise or a jQuery.Promise when you use jQuery.

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({ 
        fileSystemProvider: new DevExpress.fileManagement.CustomFileSystemProvider({             
            abortFileUpload: function(fileData, chunksInfo, destinationDir) { 
                // Your code goes here
            },
            //...
        }) 
    });     
});

copyItem

A function that copies files or folders.

Type:

Function

Function parameters:
item:

FileSystemItem

The current file system item.

destinationDirectory:

FileSystemItem

The directory where a file system item is copied to.

Return Value:

Promise<any> (jQuery or native)

| any

A Promise that is resolved after the file system item is copied. It is a native Promise or a jQuery.Promise when you use jQuery.

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({ 
        fileSystemProvider: new DevExpress.fileManagement.CustomFileSystemProvider({ 
            copyItem: function(item, destinationDir) { 
                // Your code goes here
            }
            //...
        }) 
    });     
});

createDirectory

A function that creates a directory.

Type:

Function

Function parameters:
parentDirectory:

FileSystemItem

The parent directory where a new directory should be created.

name:

String

The name of the new directory.

Return Value:

Promise<any> (jQuery or native)

| any

A Promise that is resolved after a new directory is created. It is a native Promise or a jQuery.Promise when you use jQuery.

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({ 
        fileSystemProvider: new DevExpress.fileManagement.CustomFileSystemProvider({ 
            createDirectory: function(parentDir, name) { 
                // Your code goes here
            }
            //...
        }) 
    });     
});

dateModifiedExpr

Specifies which data field provides timestamps that indicate when a file was last modified.

Type:

String

|

Function

deleteItem

A function that deletes a file or folder.

Type:

Function

Function parameters:
item:

FileSystemItem

The current file system item.

Return Value:

Promise<any> (jQuery or native)

| any

A Promise that is resolved after a file system item is deleted. It is a native Promise or a jQuery.Promise when you use jQuery.

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({ 
        fileSystemProvider: new DevExpress.fileManagement.CustomFileSystemProvider({ 
            deleteItem: function(item) { 
                // Your code goes here
            }
            //...
        }) 
    });     
});

downloadItems

A function that downloads files.

Type:

Function

Function parameters:
items:

Array<FileSystemItem>

The file system items.

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({ 
        fileSystemProvider: new DevExpress.fileManagement.CustomFileSystemProvider({ 
            downloadItems: function(Array<FileManagerItem>) { 
                // Your code goes here
            }
            //...
        }) 
    });     
});

getItems

A function that gets file system items.

Type:

Function

Function parameters:
parentDirectory:

FileSystemItem

The directory that stores file system items.

Return Value:

Promise<Array<Object>> (jQuery or native)

|

Array<Object>

A Promise that is resolved after file system items are obtained. It is a native Promise or a jQuery.Promise when you use jQuery.

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({ 
        fileSystemProvider: new DevExpress.fileManagement.CustomFileSystemProvider({ 
            getItems: function(pathInfo) { 
                // Your code goes here
            }
            //...
        }) 
    });     
});

getItemsContent

A function that get items content.

Type:

Function

Function parameters:
items:

Array<FileSystemItem>

The file system items.

Return Value:

Promise<Object> (jQuery or native)

|

Object

A Promise that is resolved after the content of the file system items is obtained. It is a native Promise or a jQuery.Promise when you use jQuery.

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({ 
        fileSystemProvider: new DevExpress.fileManagement.CustomFileSystemProvider({ 
            getItemsContent: function(pathInfo) { 
                // Your code goes here
            }
            //...
        }) 
    });

});

hasSubDirectoriesExpr

A function or the name of a data source field that provides information on whether a file or folder contains sub directories.

Type:

String

|

Function

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({ 
        fileSystemProvider: new DevExpress.fileManagement.CustomFileSystemProvider({ 
            hasSubDirectoriesExpr: "hasDirectories"
            //...
        }) 
    });

});

isDirectoryExpr

Specifies which data field provides information about whether a file system item is a directory.

Type:

String

|

Function

keyExpr

Specifies the data field that provides keys.

Type:

String

|

Function

moveItem

A function that moves files and folders.

Type:

Function

Function parameters:
item:

FileSystemItem

The current file system item.

destinationDirectory:

FileSystemItem

The directory where a file system item is moved to.

Return Value:

Promise<any> (jQuery or native)

| any

A Promise that is resolved after the file system item is moved. It is a native Promise or a jQuery.Promise when you use jQuery.

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({ 
        fileSystemProvider: new DevExpress.fileManagement.CustomFileSystemProvider({ 
            moveItem: function(item, destinationDir) { 
                // Your code goes here
            }
            //...
        }) 
    });

});

nameExpr

Specifies which data field provides file and directory names.

Type:

String

|

Function

renameItem

A function that renames files and folders.

Type:

Function

Function parameters:
item:

FileSystemItem

The current file system item.

newName:

String

The new name for the file system item.

Return Value:

Promise<any> (jQuery or native)

| any

A Promise that is resolved after the file system item is renamed. It is a native Promise or a jQuery.Promise when you use jQuery.

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({ 
        fileSystemProvider: new DevExpress.fileManagement.CustomFileSystemProvider({ 
            renameItem: function(item, name) { 
                // Your code goes here
            }
            //...
        }) 
    });

});

sizeExpr

Specifies which data field provides file sizes.

Type:

String

|

Function

thumbnailExpr

Specifies which data field provides icons to be used as thumbnails.

Type:

String

|

Function

The data field can contain one of the following:

uploadFileChunk

A function that uploads a file in chunks.

Type:

Function

Function parameters:
file:

File

The file that is being uploaded.

uploadInfo:

UploadInfo

Information about the file upload session.

destinationDirectory:

FileSystemItem

The directory where a file system item is uploaded to.

Return Value:

Promise<any> (jQuery or native)

| any

A Promise that is resolved after the file system item is uploaded. It is a native Promise or a jQuery.Promise when you use jQuery.

jQuery
JavaScript
$(function () {
    $("#file-manager").dxFileManager({ 
        fileSystemProvider: new DevExpress.fileManagement.CustomFileSystemProvider({ 
            uploadFileChunk: function(fileData, chunksInfo, destinationDir) { 
                // Your code goes here
            }
            //...
        }) 
    });
});