New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Add custom columns

  • Open
  • Delete
  • Rename
  • New Folder
  • Upload
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  • Upload
  •  images
    •  AllImages
    •  Customers
    •  Products
  • Delete
  • Rename
  • New Folder
  • Upload
Table that lists the contents of the current directory
FilenameSizeCreation DateOwner Name
Table that lists the contents of the current directory
    
    
    
    
    
    
    
    
    
    
    
Max file size allowed:
200.00 KB
File extensions allowed:
*.*
  • Demo Configurator
Custom columns

In the Q2 2009 release we introduced support for custom columns in the embedded RadGrid. This example demonstrates the steps that need to be done in order to add two custom columns into the Grid.

  • The first step is to implement a custom FileSystemContentProvider. The CustomColumnsContentProvider class inherits the FileSystemContentProvider and this is the easiest way to implement a custom provider. The new files/folders should have two additional attributes : Date and Owner (for example) that are added at this stage.
  • The second step is to build two GridTemplateColumns programmatically and add them in the Columns collection of the Grid.
    Please note that the values of the UniqueName properties of the newly created GridTemplateColumns should be the same as the names of the newly added properties to the files/folders (e.g. gridTemplateColumn1.UniqueName = "Date"; and gridTemplateColumn2.UniqueName = "Owner"; in the example)
  • DefaultVB.aspx
  • DefaultVB.aspx.vb
<%@ Page Language="vb" CodeFile="DefaultVB.aspx.vb" AutoEventWireup="true" Inherits="Telerik.Web.Examples.FileExplorer.CustomGridColumns.DefaultVB" %>

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container size-wide">
        <telerik:RadFileExplorer RenderMode="Lightweight" runat="server" ID="RadFileExplorer1" Width="795px" Height="320px"
            EnableOpenFile="true" OnExplorerPopulated="RadFileExplorer1_ExplorerPopulated">
            <Configuration ViewPaths="~/FileExplorer/ExplorerSource/images/" DeletePaths="~/FileExplorer/ExplorerSource/images/"
                UploadPaths="~/FileExplorer/ExplorerSource/images/"></Configuration>
        </telerik:RadFileExplorer>
    </div>

    <telerik:RadAjaxManager ID="theAjaxManager" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="AddDateColumn">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadFileExplorer1" LoadingPanelID="theLoadingPanel" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="AddOwnerColumn">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadFileExplorer1" LoadingPanelID="theLoadingPanel" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadAjaxLoadingPanel ID="theLoadingPanel" runat="server"></telerik:RadAjaxLoadingPanel>
    <qsf:ConfiguratorPanel ID="Configuratorpanel1" runat="server">
        <Views>
            <qsf:View>
                <qsf:ConfiguratorColumn ID="ConfiguratorColumn1" runat="server" Title="Custom columns" Size="Wide">
                    <ul class="fb-group">
                        <li><span class="checkbox">
                            <asp:CheckBox ID="AddDateColumn" runat="server" Text="Add <em>Creation Date</em> column"
                                AutoPostBack="true" Checked="true"></asp:CheckBox></span></li>
                        <li><span class="checkbox">
                            <asp:CheckBox ID="AddOwnerColumn" runat="server" Text="Add <em>Owner Name</em> column"
                                AutoPostBack="true" Checked="true"></asp:CheckBox></span></li>
                    </ul>
                </qsf:ConfiguratorColumn>
            </qsf:View>
        </Views>
    </qsf:ConfiguratorPanel>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance