DHTMLX Vault - JavaScript File Upload Library

The JS file upload library is an extremely easy-to-use control for the intuitive uploading and managing of various file types.

Get Started with DHTMLX JavaScript File Upload Library

Uploading multiple files

DHTMLX Vault ensures handling multiple files efficiently. An embedded progress bar allows end-users to monitor the uploading process in real-time. They can also drag and drop files in a queue, rename, and delete them.

Auto and manual file upload

By default, our JavaScript file upload library automatically uploads files to the server once users add them. You can set a manual file upload instead so your users will drag files to Vault and then upload them by clicking the Upload button.

User-friendly file management

Inline editing is available by default, so end-users can rename a file by double-clicking it. Besides, there is an option to show items in the uploaded file list and sort them by some criterion, for example, by name or by size in ascending/descending order.

Creating custom templates

Our JavaScript file upload library is easily customizable, so you can modify the toolbar, status bar, and file icons with a few lines of code. Moreover, you can create templates to adjust the appearance of the Vault layout in the list and grid modes, including the progress bar of the file upload control.

Swappable toolbar controls and icons

DHTMLX Vault allows adding new custom controls to the toolbar and deleting unnecessary ones. For example, we’ve added a calculator button you can click to get the total size of uploaded files. You can also replace the default icons of toolbar controls with any other icon font.

Adjustable progress bar

You can adjust the progress bar of the JavaScript file upload control to illustrate the upload process with custom parameters. You have options to display the current percent of files uploading as well as the size of uploaded files and the total size of all files in bytes.

JS File Upload Control Features

• Flexible integration with any back-end technology
• Real-time progress bar indicator
• File drag-and-drop
• Multiple file selection
• File & image previews
• Grid & list modes
• Filtering & sorting files in the list
• Auto and manual file upload
• Cancellable file upload
• Loading the list of previously uploaded files or all files kept on the server
• Removing uploaded files from the list
• Downloading the uploaded files
• Layout, toolbar & progress bar customization
• Localization for text labels
• Custom icons for files
• Custom upload restrictions
• Material skin
• Support for React, Angular, and Vue.js
• Cross-browser compatibility
• Inline editing
• Keyboard navigation
• Ability to disable file previews
• Built-in themes
• Creating custom templates
• Custom drop area
• Custom JS scroll

Why Choose JavaScript File Upload Library by DHTMLX?

Fast and handy JavaScript file upload control

With DHTMLX Vault, you can browse and select files from the computer or drag them to the files' zone to start the upload automatically. The file upload plugin in JavaScript allows switching between the list mode and grid mode with image previews.

Manage the upload of files smoothly

You can define custom upload restrictions like file extension, size, etc. The list of files can be easily cleared without losing data on the server. Files can be also loaded back to the list from the server and downloaded to the computer.

Embedded file upload progress bar

The JavaScript file upload progress bar shows graphically the progress of each file transfer as percentages. Optionally, DHTMLX Vault can be customized to reflect the estimated time, file size remaining for upload, or other characteristics.

Multifunctional toolbar

The toolbar is supplied with icon buttons for adding files to Vault, uploading them to the server, and clearing the whole file list. Besides, the toolbar can be customized to include any other controls. The tooltip appears when hovering over icons.

Support for the most popular frameworks

Our file upload control in HTML/JavaScript is specially tailored to support the most popular frameworks like Vue.js, React, and Angular. There're separate guides for each framework to make the process of implementing Vault in your project smooth and quick.