Tab
A newer version of this page is available. Switch to the current version.

ASPxFileManager Class

A file management control.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v18.2.dll

Declaration

public class ASPxFileManager :
    ASPxDataWebControl,
    IRequiresLoadPostDataControl,
    IParentSkinOwner,
    ISkinOwner,
    IPropertiesOwner,
    IControlDesigner
Public Class ASPxFileManager
    Inherits ASPxDataWebControl
    Implements IRequiresLoadPostDataControl,
               IParentSkinOwner,
               ISkinOwner,
               IPropertiesOwner,
               IControlDesigner

Remarks

The ASPxFileManager control allows you to manage files and folders.

ASPxFileManager - ASPxFileManager

Create a File Manager

Design Time

The ASPxFileManager control is available on the DX.19.1: Common Controls toolbox tab in the Microsoft Visual Studio IDE.

Drag the control onto a form and customize control settings, or paste the control markup in the page's source code.

<dx:ASPxFileManager ID="fileManager" runat="server" ...>
    <Settings RootFolder="~/Content/FileManager/Files" ThumbnailFolder="~/Content/FileManager/Thumbnails" />
    <SettingsUpload UseAdvancedUploadMode="true">
        <AdvancedModeSettings EnableMultiSelect="true" />
    </SettingsUpload>
</dx:ASPxFileManager>

Run Time

using DevExpress.Web;
...
protected void Page_Load(object sender, EventArgs e)
{
    ASPxFileManager fm = new ASPxFileManager();
    fm.ID = "ASPxFileManager1";
    fm.SettingsUpload.ValidationSettings.DisableHttpHandlerValidation = true;
    Page.Form.Controls.Add(fm);

    fm.SettingsUpload.UseAdvancedUploadMode = true;
    fm.SettingsUpload.AdvancedModeSettings.EnableMultiSelect = true;
}
NOTE

The File Manager requires registering the ASPxUploadProgressHttpHandler in the web.config file. If it's impossible to automatically validate the ASPxUploadProgressHttpHandler, for example, if the handler is registered inside the section and the InheritInChildApplications property is set to false, disable the automatic validation option by setting the DisableHttpHandlerValidation property to false.

Client-Side API

The ASPxFileManager's client-side API is implemented with JavaScript language and exposed by the ASPxClientFileManager object.

Availability

Available by default.

Class name

ASPxClientFileManager

Access name

ClientInstanceName

Events

ASPxFileManager.ClientSideEvents

See demo

Features

Use the InitialFolder property to specify the initially selected folder in the file manager, where a user starts browsing. If the property value is empty, the file manager uses the path from the RootFolder property as an initial folder.

<dx:ASPxFileManager ID="ASPxFileManager1" runat="server" Width="700px">
     <Settings RootFolder="~\Files\" ThumbnailFolder="~\Thumbnails\" 
          AllowedFileExtensions=".jpg, .jpeg, .gif, .rtf, .txt, .avi, .png, .mp3, .xml, .doc, .pdf" 
          InitialFolder="Images\Employees" />
     <SettingsEditing AllowCreate="True" AllowDelete="True" AllowMove="True" AllowRename="True" />
     <SettingsPermissions>
          <AccessRules>
               <dx:FileManagerFolderAccessRule Edit="Deny" />
               <dx:FileManagerFolderAccessRule Edit="Allow" Path="Documents\Reports" />
          </AccessRules>
     </SettingsPermissions>
</dx:ASPxFileManager>

Learn more

Data Binding

The ASPxFileManager allows you to load its content from a database. Assign a data source to the DataSourceID property and map the data source's fields to the file manager (SettingsDataSource).

<dx:ASPxFileManager ID="ASPxFileManager1" runat="server" DataSourceID="AccessDataSource1">
    ...
    <SettingsDataSource KeyFieldName="Id" ParentKeyFieldName="ParentID" NameFieldName="Name" 
        IsFolderFieldName="IsFolder" FileBinaryContentFieldName="Data" LastWriteTimeFieldName="LastWriteTime"/>
</dx:ASPxFileManager>
<asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="~/App_Data/FilesCatalog.mdb" 
    SelectCommand="SELECT [ID], [Name], [ParentID], [IsFolder], [Data], [LastWriteTime] FROM [FileSystem]"
    ...
</asp:AccessDataSource>

See demo

View Modes

The ASPxFileManager supports two file list view modes (View property):

  • Thumbnails - Displays files' thumbnails.
  • Details - Displays information about files in a grid view.
<dx:ASPxFileManager ID="fileManager" runat="server" >
    ...
    <SettingsFileList View="Details">
        <DetailsViewSettings AllowColumnResize="true" AllowColumnDragDrop="true" />
    </SettingsFileList>
</dx:ASPxFileManager>

Learn more | See demo

Thumbnails Support

ASPxFileManager automatically creates thumbnails for image files with the following file extensions: .bmp, .gif, .ico, .jpg, .jpeg, .png. You can also use the the CustomThumbnail event to provide custom thumbnails for the ASPxFileManager.

<dx:ASPxFileManager ID="fileManager" runat="server" OnCustomThumbnail="fileManager_CustomThumbnail">
    ...
</dx:ASPxFileManager>

Learn more | See demo

Files Upload

Set the Enabled property to true to allow file uploading in the file manager. The file manager supports two upload modes (UseAdvancedUploadMode):

  • Standard Mode - the file manager sends the uploaded file to the server in one request and caches the file in server memory.

  • Advanced Mode - the file manager sends the uploaded file to the server in small packets (one by one) and saves the file into a temporary file within a specific server folder.

<dx:ASPxFileManager ID="fileManager" runat="server" ...>
    ...
    <SettingsUpload UseAdvancedUploadMode="true">
        <AdvancedModeSettings EnableMultiSelect="true" />
    </SettingsUpload>
</dx:ASPxFileManager>

Learn more | See demo

Custom Filter API

The ASPxFileManager provides APIs that allows you to filter its file list programmatically in a custom manner. For instance, you can write code to display only certain files types (such as images, spreadsheets or rich text documents) or the most recently used files.

See demo

The file manager provides the breadcrumbs element that allows end-users to track their locations in folders. To display the breadcrumbs, set the Visible property to true. Use the SettingsBreadcrumbs property to access the breadcrumbs element settings.

<dx:ASPxFileManager ID="fileManager" runat="server" >
    ...
    <SettingsBreadcrumbs Visible="true" ShowParentFolderButton="true" Position="Top" />
</dx:ASPxFileManager>

See demo

Cloud Storages Support

The ASPxFileManager supports the most popular cloud services: Amazon Simple Storage Service (Amazon S3), Microsoft Azure, Dropbox, Google Drive, and OneDrive.

<dx:ASPxFileManager ID="FileManager" runat="server" ProviderType="OneDrive">
    <SettingsOneDrive AccountName="FileManagerOneDriveAccount" 
    TokenEndpoint="https://login.microsoftonline.com/{tenant}/oauth2/token" 
    RedirectUri="http://mysite.com" />
    ...
</dx:ASPxFileManager>

Learn more | See demo

Multiple File Selection

You can choose multiple files (EnableMultiSelect) and perform actions on them simultaneously. Use the SelectionChanged client event and the GetSelectedItems method to obtain information about selected files.

<dx:ASPxFileManager ID="ASPxFileManager1" ClientInstanceName="fileManager" runat="server">
    <Settings EnableMultiSelect="true" RootFolder="~/Content/FileManager/Files/Images" InitialFolder="Product icons" ThumbnailFolder="~/Content/FileManager/Thumbnails"/>
    <ClientSideEvents SelectionChanged="fileManager_Selecti