React FileManager - Custom.Configuration

This section describes options that configure a custom file provider.

abortFileUpload

A function that cancels the file upload.

Type:

jQuery

JavaScript

$(function () {
    $("#file-manager").dxFileManager({ 
        fileProvider: new DevExpress.fileProviders.Custom({             
            abortFileUpload: function(fileData, chunksInfo, destinationDir) { 
                // Your code goes here
            },
            //...
        }) 
    });     
});

copyItem

A function that copies files or folders.

Type:

Function

jQuery

JavaScript

$(function () {
    $("#file-manager").dxFileManager({ 
        fileProvider: new DevExpress.fileProviders.Custom({ 
            copyItem: function(item, destinationDir) { 
                // Your code goes here
            }
            //...
        }) 
    });     
});

createDirectory

A function that creates a folder.

Type:

Function

jQuery

JavaScript

$(function () {
    $("#file-manager").dxFileManager({ 
        fileProvider: new DevExpress.fileProviders.Custom({ 
            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

jQuery

JavaScript

$(function () {
    $("#file-manager").dxFileManager({ 
        fileProvider: new DevExpress.fileProviders.Custom({ 
            deleteItem: function(item) { 
                // Your code goes here
            }
            //...
        }) 
    });     
});

downloadItems

A function that downloads a file or folder.

Type:

Function

jQuery

JavaScript

$(function () {
    $("#file-manager").dxFileManager({ 
        fileProvider: new DevExpress.fileProviders.Custom({ 
            downloadItems: function(Array<FileManagerItem>) { 
                // Your code goes here
            }
            //...
        }) 
    });     
});

getItems

A function that gets file system items.

Type:

Function

jQuery

JavaScript

$(function () {
    $("#file-manager").dxFileManager({ 
        fileProvider: new DevExpress.fileProviders.Custom({ 
            getItems: function(pathInfo) { 
                // Your code goes here
            }
            //...
        }) 
    });     
});

getItemsContent

A function that get items content.

Type:

Function

jQuery

JavaScript

$(function () {
    $("#file-manager").dxFileManager({ 
        fileProvider: new DevExpress.fileProviders.Custom({ 
            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({ 
        fileProvider: new DevExpress.fileProviders.Custom({ 
            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

jQuery

JavaScript

$(function () {
    $("#file-manager").dxFileManager({ 
        fileProvider: new DevExpress.fileProviders.Custom({ 
            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

jQuery

JavaScript

$(function () {
    $("#file-manager").dxFileManager({ 
        fileProvider: new DevExpress.fileProviders.Custom({ 
            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:

The icon's URL
The icon's name if the icon is from the DevExtreme icon library
The icon's CSS class if the icon is from an external icon library (see External Icon Libraries)
The icon in the Base64 format

uploadChunkSize

Specifies a chunk size in bytes.

Type:

Number

The FileManager can upload large files in parts. The widget divides a file into parts and sends them in separate requests. Set the uploadChunkSize option to a positive value to enable this functionality.

jQuery

JavaScript

$(function () {
    $("#file-manager").dxFileManager({ 
        fileProvider: new DevExpress.fileProviders.Custom({ 
            uploadChunkSize: 1000 
        }) 
    });
});

uploadFileChunk

A function that uploads a file in chunks.

Type:

Function

jQuery

JavaScript

$(function () {
    $("#file-manager").dxFileManager({ 
        fileProvider: new DevExpress.fileProviders.Custom({ 
            uploadFileChunk: function(fileData, chunksInfo, destinationDir) { 
                // Your code goes here
            }
            //...
        }) 
    });
});