JavaScript/jQuery FileManager - Overview

DevExtreme FileManager is an interactive component that allows users to view and manage files and directories. The component supports editing, deleting, and uploading operations.

This overview highlights FileManager elements, key features, and what to explore next.

1. Toolbar
2. Root Folder
3. Child Folder
4. Item View Header
5. Item View Column Headers
6. Items

• File System Support
  The DevExtreme FileManager supports in-memory (JSON), remote, and custom file system provider types.

• Cloud Service Integration
  You can implement the custom file system provider type to connect FileManager to a cloud service provider (for instance, Amazon S3 or Azure Blob).

• Detail and Thumbnail Views
  FileManager supports two file representation modes: "Thumbnails" and "Details". "Thumbnails" displays only thumbnails, while "Details" includes additional information. Users can switch between the two options in the FileManager toolbar.

• Configurarble Permissions
  DevExtreme FileManager allows you to configure permissions to manage user access to files. You can enable/disable operations such as file upload/download, creation, and deletion.

• File Uploading
  You can configure upload options such as maximum file size and chunk uploading. Users can upload files through drag and drop operations or in the component toolbar.

• Adaptability
  DevExtreme FileManager fits screens of all sizes and ships with right-to-left (RTL) representation support.

• Customization
  FileManager allows you to customize visual elements such as file thumbnails and toolbar items.

• Data Selection
  FileManager supports single and multiple selection modes. The following image demonstrates available FileManager item states:
  

  1. Selected Item
  2. Selected and Focused
  3. Hover State
  4. Default State
  5. Focused Item

• Getting Started with FileManager

• API

• Demos