Custom Columns
- 3 minutes to read
The ASPxFileManager control allows you to provide custom columns in Details view mode.
To implement a custom column, add an object of the FileManagerDetailsCustomColumn class to the FileManagerFileListDetailsViewSettings.Columns collection.
Note
A custom column’s name (the FileManagerDetailsCustomColumn.Name property) cannot duplicate the file manager item‘s property names; in particular ‘Extension’, ‘Folder’, ‘FullName’, ‘LastWriteTime’, ‘Length’, ‘Name’, ‘Parent’, ‘RelativeName’, and ‘Location’.
When a custom column cell is rendered, the ASPxFileManager.DetailsViewCustomColumnDisplayText event fires allowing you to provide custom display text. You can use the event argument FileManagerDetailsViewCustomColumnDisplayTextEventArgs.Column and FileManagerDetailsViewCustomColumnDisplayTextEventArgs.File (or FileManagerDetailsViewCustomColumnDisplayTextEventArgs.Item) properties to access the currently processed column and file, respectively. The FileManagerDetailsViewCustomColumnDisplayTextEventArgs.DisplayText property allows you to specify the processed cell display text.
Example
This code sample demonstrates how to populate a file manager custom column with values (file extensions) using the ASPxFileManager.DetailsViewCustomColumnDisplayText
Note
A complete sample project is available at https://github.com/DevExpress-Examples/aspxfilemanager-how-to-implement-a-custom-column-and-provide-it-with-a-custom-header-filter-t220483
<dx:ASPxFileManager ID="ASPxFileManager1" runat="server" Width="800px" Height="400px" OnDetailsViewCustomColumnDisplayText="ASPxFileManager1_DetailsViewCustomColumnDisplayText" OnDetailsViewCustomColumnHeaderFilterFillItems="ASPxFileManager1_DetailsViewCustomColumnHeaderFilterFillItems">
<Settings RootFolder="~\Files\" ThumbnailFolder="~\Thumb\" />
<SettingsFileList View="Details">
<DetailsViewSettings>
<Columns>
<dx:FileManagerDetailsColumn Caption=" " FileInfoType="Thumbnail" VisibleIndex="0">
</dx:FileManagerDetailsColumn>
<dx:FileManagerDetailsColumn Caption="Name" VisibleIndex="1">
</dx:FileManagerDetailsColumn>
<dx:FileManagerDetailsCustomColumn Caption="Extension" Name="FileExtension" VisibleIndex="2" ShowHeaderFilterButton="True">
</dx:FileManagerDetailsCustomColumn>
</Columns>
</DetailsViewSettings>
</SettingsFileList>
</dx:ASPxFileManager>
How to Implement a Custom Header Filter for a Custom Column
You can specify a custom column’s header filter availability by using the FileManagerDetailsCustomColumn.ShowHeaderFilterButton property. If the property is set to Default, the header filter availability is defined by the FileManagerFileListDetailsViewSettings.ShowHeaderFilterButton property.
By default, the header filter displays a list of available column cell values and All, Blanks, and Non blanks items.
You can use the ASPxFileManager.DetailsViewCustomColumnHeaderFilterFillItems event to provide custom header filter items. The FileManagerDetailsViewCustomColumnHeaderFilterFillItemsEventArgs.Column event argument property determines the custom column currently being filtered. The FileManagerDetailsViewCustomColumnHeaderFilterFillItemsEventArgs.Values property lists the header filter values.
You can clear the default items using the Clear method. The FileManagerDetailsViewCustomColumnHeaderFilterFillItemsEventArgs.AddShowAll method allows you to add the All item to the header filter. To add a custom filter value to the FileManagerDetailsViewCustomColumnHeaderFilterFillItemsEventArgs.Values list, use one of the FileManagerDetailsViewCustomColumnHeaderFilterFillItemsEventArgs.AddValue overloads.
Example
This code sample demonstrates how to populate a custom column’s header filter with custom items. For this purpose, the ASPxFileManager.DetailsViewCustomColumnHeaderFilterFillItems event is handled.
Note
A complete sample project is available at https://github.com/DevExpress-Examples/aspxfilemanager-how-to-implement-a-custom-column-and-provide-it-with-a-custom-header-filter-t220483
<dx:ASPxFileManager ID="ASPxFileManager1" runat="server" Width="800px" Height="400px" OnDetailsViewCustomColumnDisplayText="ASPxFileManager1_DetailsViewCustomColumnDisplayText" OnDetailsViewCustomColumnHeaderFilterFillItems="ASPxFileManager1_DetailsViewCustomColumnHeaderFilterFillItems">
<Settings RootFolder="~\Files\" ThumbnailFolder="~\Thumb\" />
<SettingsFileList View="Details">
<DetailsViewSettings>
<Columns>
<dx:FileManagerDetailsColumn Caption=" " FileInfoType="Thumbnail" VisibleIndex="0">
</dx:FileManagerDetailsColumn>
<dx:FileManagerDetailsColumn Caption="Name" VisibleIndex="1">
</dx:FileManagerDetailsColumn>
<dx:FileManagerDetailsCustomColumn Caption="Extension" Name="FileExtension" VisibleIndex="2" ShowHeaderFilterButton="True">
</dx:FileManagerDetailsCustomColumn>
</Columns>
</DetailsViewSettings>
</SettingsFileList>
</dx:ASPxFileManager>