---
title: "File Explorer in JavaScript"
published_at: "2015-05-08T04:31:03+00:00"
modified_at: "2019-11-13T10:06:52+00:00"
url: "https://www.syncfusion.com/blogs/post/file-explorer-in-javascript-2"
excerpt: "The File Explorer control for JavaScript provides a Windows Explorer-like interface within a web application, allowing end-users to browse, upload, and download files. Folder structure can be changed by renaming, moving, or deleting folders and files, and the control’s layout..."
taxonomy_category:
  - "Company"
  - "Syncfusion"
taxonomy_post_tag:
  - "Details View"
  - "File Explorer"
  - "Grid View"
---

# File Explorer in JavaScript

[reports](https://www.syncfusion.com/blogs/author/reports)

![Image](https://www.syncfusion.com/blogs/wp-content/uploads/2018/08/default_d2b71053.png)


The File Explorer control for JavaScript provides a Windows Explorer-like interface within a web application, allowing end-users to browse, upload, and download files. Folder structure can be changed by renaming, moving, or deleting folders and files, and the control’s layout and folder management can be customized.

#### Features of File Explorer

##### Layout Types

The File Explorer control supports two types of layouts to view files: *thumbnail* view and *grid* view.

![clip_image002](https://blog.syncfusion.com/wp-content/uploads/2018/10/file-explorer-detailed-grid-view.jpg "clip_image002")

File Explorer in Detailed Grid View

![clip_image004](https://blog.syncfusion.com/wp-content/uploads/2018/10/file-explorer-thumbnail-view.jpg "clip_image004")

File Explorer in Thumbnail View

##### Image Preview

You can preview an image by double clicking it, which opens the image in a dialog window. The previewed image can then be zoomed by resizing the dialog box.

![clip_image006](https://blog.syncfusion.com/wp-content/uploads/2018/10/file-explorer-with-image-preview.jpg "clip_image006")

File Explorer with Image Preview

##### Custom Layout

The layout of the File Explorer panel can be customized.

![clip_image008](https://blog.syncfusion.com/wp-content/uploads/2018/10/file-explorer-with-customized-layout.jpg "clip_image008")

File Explorer with Customized Layout

##### Sorting Support

In the details view or the grid view, files can be sorted by desired fields.

![clip_image010](https://blog.syncfusion.com/wp-content/uploads/2018/10/file-explorer-detailed-grid-view-with-sorting-support.jpg "clip_image010")

File Explorer in Detailed Grid View with Sorting Support

##### Custom Tool Support

In the File Explorer toolbar, you can create custom tools with customized actions. For example, here the Help tool has been created as a custom tool in the toolbar.

![clip_image002\[4\]](https://blog.syncfusion.com/wp-content/uploads/2018/10/file-explorer-with-custom-tool-option.jpg "clip_image002[4]")

File Explorer with Custom Tool option

For more information:

HTML5/ JavaScript: [https://js.syncfusion.com/demos/web/#!/azure/fileexplorer/DefaultFunctionalities](https://js.syncfusion.com/demos/web/#!/azure/fileexplorer/DefaultFunctionalities)

ASP.NET MVC: [https://mvc.syncfusion.com/demos/web/fileexplorer/default](https://mvc.syncfusion.com/demos/web/fileexplorer/default)

Online documentation of File Explorer: [https://help.syncfusion.com/aspnet/fileexplorer/overview](https://help.syncfusion.com/aspnet/fileexplorer/overview)

*Content Editor: Usha Clementine Henry* | *Content Contributor:**Balaji Murugesan*