Telerik is a leading vendor of ASP.NET AJAX, ASP.NET MVC, Silverlight, WinForms and WPF controls and components, as well as .NET Reporting, .NET ORM , .NET CMS, Code Analysis, Mocking, Team Productivity and Automated Testing Tools. Building on its expertise in interface development and Microsoft technologies, Telerik helps customers build applications with unparalleled richness, responsiveness and interactivity. Telerik products help thousands of companies to be more productive and deliver reliable applications under budget and on time.
Version Q2 2011 released 07/12/2011
select

FileExplorer / First Look

Browse to an image and double click to preview.
  
  
  
  
  
  
  
  
  
  
  
Max file size allowed:
200.00 KB
File extensions allowed:
*.jpg, *.jpeg, *.gif, *.png
Preview
Properties
Choose explorer controls:
Set control behavior:

  • RadFileExplorer

    Main features:

    • A single control, integrated in Telerik.Web.UI - ready to drag and drop on the page
    • Directory load on demand loading using ASP.NET 2.0 AJAX Callback mechanism
    • Clientside and server events for file operations
    • Uses the FileBrowserContentProvider abstraction of RadEditor for hooking to any underlying file system, such as OS, database, MOSS SharePoint, MCMS
    • Sorting of files and folders
    • Context menus
    • Ability to delete and rename files and folders
    • Ability to create new folders
    • Ability to enable paging for the grid if the folders contain a large number of items (e.g. more than 200)

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="Telerik.Web.Examples.FileExplorer.Default.DefaultCS" %>

    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
    <%@ Register TagPrefix="qsf" TagName="Header" Src="~/Common/Header.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="Footer" Src="~/Common/Footer.ascx" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <qsf:HeadTag runat="server" ID="Headtag1"></qsf:HeadTag>
        <style type="text/css">
            h5
            {
                margin: 3px;
                margin-top: 6px;
            }
        </style>
        <telerik:RadCodeBlock ID="codeBlock1" runat="server">

            <script type="text/javascript">
                //<![CDATA[
                function OnClientItemSelected(sender, args)
                {
                    var pvwImage = $get("<%= pvwImage.ClientID %>");
                    var imageSrc = args.get_path();

                    if (imageSrc.match(/\.(gif|jpg)$/gi))
                    {
                        pvwImage.src = imageSrc;
                        pvwImage.style.display = "";
                        pvwImage.alt = imageSrc.substring(imageSrc.lastIndexOf('/') + 1);
                    }
                    else
                    {
                        pvwImage.src = imageSrc;
                        pvwImage.style.display = "none";
                        pvwImage.alt = imageSrc.substring(imageSrc.lastIndexOf('/') + 1);
                    }
                }
                //]]>
            </script>

        </telerik:RadCodeBlock>
    </head>
    <body class="BODY">
        <form id="form1" runat="server">
        <qsf:Header ID="Header1" runat="server" NavigationLanguage="c#" />
        <telerik:RadScriptManager ID="RadScriptManager1" runat="Server">
        </telerik:RadScriptManager>
        <telerik:RadFormDecorator runat="server" ID="RadFormDecorator1" DecoratedControls="All" />
        <table cellspacing="4">
            <tr>
                <td rowspan="2" style="vertical-align: top;">
                    Browse to an image and double click to preview.
                    <telerik:RadFileExplorer runat="server" ID="FileExplorer1" Width="520px" Height="520px"
                        OnClientItemSelected="OnClientItemSelected">
                        <Configuration ViewPaths="~/FileExplorer/Examples/Default/Images" UploadPaths="~/FileExplorer/Examples/Default/Images"
                            DeletePaths="~/FileExplorer/Examples/Default/Images" />
                    </telerik:RadFileExplorer>
                </td>
                <td>
                    <fieldset style="width: 230px; height: 220px">
                        <legend>Preview</legend>
                        <img id="pvwImage" src="~/Common/Img/qsfConfigPixel.gif" runat="server" alt="~/Common/Img/qsfConfigPixel.gif"
                            style="display: none; margin: 10px; width: 200px; height: 180px; vertical-align: middle;" />
                    </fieldset>
                </td>
            </tr>
            <tr>
                <td valign="top" id="decoratorZone">
                    <fieldset style="width: 230px; height: 320px;">
                        <legend>Properties</legend>
                        <h5>
                            Choose explorer controls:</h5>
                        <asp:CheckBoxList Width="140px" ID="visibleControls" CellSpacing="0" runat="server">
                            <asp:ListItem Selected="true" Text="Address Box" Value="AddressBox"></asp:ListItem>
                            <asp:ListItem Selected="true" Text="Grid" Value="Grid"></asp:ListItem>
                            <asp:ListItem Selected="true" Text="Toolbar" Value="Toolbar"></asp:ListItem>
                            <asp:ListItem Selected="true" Text="TreeView" Value="TreeView"></asp:ListItem>
                            <asp:ListItem Selected="true" Text="Context Menus" Value="ContextMenus"></asp:ListItem>
                        </asp:CheckBoxList>
                        <h5>
                            Set control behavior:</h5>
    <asp:CheckBox ID="enableUpload" Width="130px" Text="Enable upload?" Checked="true"
    runat="server" Style="margin-left: 3px" />
                        <br />
    <asp:CheckBox ID="enableCreateNewFolder" Width="130px" Text="Allow new folders?"
    Checked="true" runat="server" Style="margin-left: 3px" />
                        <br />
    <asp:CheckBox ID="displayUpFolder" Width="160px" Text="Display up folder(..) item?"
    Checked="false" runat="server" Style="margin-left: 3px" />
                        <br />
    <asp:CheckBox ID="enableOpenFile" Width="165px" Text="Open files on double-click?"
    Checked="true" runat="server" Style="margin-left: 3px" />
                        <br />
    <asp:CheckBox ID="allowPaging" Width="165px" Text="Enable paging for the grid" Checked="false"
    runat="server" Style="margin-left: 3px" />
                        <br />
                        <br />
                        <asp:Button ID="Update" Text="Update RadFileExplorer" Width="145px" runat="server" />
                    </fieldset>
                </td>
            </tr>
        </table>
        <qsf:Footer runat="server" ID="Footer1" />
        </form>
    </body>
    </html>

Get more than expected!

 
 

Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerik’s unlimited dedicated support.

Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.

If you have any questions, do not hesitate to contact us at sales@telerik.com.

Copyright 2002-2024 © Telerik. All right reserved
Telerik Inc, 201 Jones Rd, Waltham, MA 02451