This is a migrated thread and some comments may be shown as answers.

I Had To Build My Own Because...

34 Answers 1515 Views

FileExplorer

This is a migrated thread and some comments may be shown as answers.

Shaun Peet asked on 08 Apr 2009, 09:20 PM

The new RadFileExplorer is a wonderful new addition to the Telerik lineup, and once the few remaining minor bugs are worked out it will really be a great control. For a majority of scenarios where all you need to do is list raw directories and files, and pick one, it works great. Both as a stand-alone as well as a part of one of the Editor's dialogs. Part of the beauty of the control is its simplicity. However, there are no doubt some more complicated situations where the built-in functionality falls short.

This thread is not about bashing the RadFileExplorer. It is about describing scenarios in which the need arose for a custom-built way of navigating & selecting files because it simply wasn't possible with the current RadFileExplorer. In doing so, Telerik can make the decision about whether or not to add functionality to tackle some of these scenarios. If possible, suggest a solution to the problem in terms of a "feature request".

And with that, I'll start things off...

The problem I ran into was that there is no way for the folders in the tree or grid to be "labeled" with anything other than the actual directory or file name. I'm actually quite certain that this must be a common scenario. In a specific case for a sports website we've built, the database allows for multiple teams to be setup for a given season, and each team has its own images directory created using the ID of that team. So the directory structure on the disk is something like /images/teams/1000/ (which belongs to "Team A") and /images/teams/1001/ (which belongs to "Team B"). The problem with this is that the average user only knows of their team by its name and not its ID, and this is particularly true when a user wants to borrow an image from another team (they definitely won't know the ID, they'd have to look it up).

So, here's a "Feature Request": Have the abilty to create a custom FileSystemContentProvider where each directory can have both a path as well as a label - and the label is what shows up in the tree / grid but it uses the path for navigating around.

Another situation, related to the one above, is something that we're realizing now after having gone live with our product for a few years. We didn't decide to group the team folders on the file system according to the season they participated - the directory structure is simply /images/teams/team ID. So, we've learned that not only is it important to be able to label a directory but it's equally important in our case to be able to put a directory into a context (parent node) which makes sense. In the terms of the FileExplorer, we needed the tree to look like this: season 1 -> team A, season 1 -> team B, season 2 -> team C, and so on. However, the "season" node wouldn't actually correspond to any actual directory, it is simply used as a logical grouping of other directories.

Feature Request: Have the ability to create a custom FileSystemContentProvider where a "directory" can actually be a node in the tree which does not represent a physical folder.

My last situation for this post has to do with usability. My target audience in terms of technical capabilities is the below-average computer/web user, and since I'm a bit of a control freak I prefer to control what these people are doing so they can't mess things up too badly. So, when it comes to an ImageManager I pre-create several folders for the user to keep their images organized, and then only allow for the user to upload into the folder that makes the most sense given the context of what they're doing. So, the user is presented with, say, five folders in the tree of the RadFileExplorer; all of which are available to pick images to use, but only one of which allows for them to upload. While having the upload button enable/disable depending on the currently selected folder is an improvement from the past, there still is no way to provide a visual clue in the tree of folders as to the read/write permissions available for each.

Feature Request: Have the ability to specifiy an icon (or css class) to be used for a folder when it is displayed in the tree (and perhaps the grid as well) that indicates whether or not that folder has write permissions or any other special attributes.

So, again, I'm not trying to bash the RadFileExplorer control since it does work great in a number of other, more simple (normal) scenarios. The only reason I start this thread is because I've been around Telerik long enough to know that they're still working on the RadDoAllMyWorkForMe control and take pride in delivering more than expected. That, and given that I was able to make my own using the same components as the RadFileExplorer makes me think it could one day be included in the control.

Please add your own scenarios where you had to build your own control and maybe they could be included in vNext of the RadFileExplorer.

34 Answers, 1 is accepted

answered on 09 Apr 2009, 08:01 AM

Hi,

FileExplorer is almost looking and a "real File Explorer". And it is really useful in CMS or similar scenarios.

There are three points missing from my point of view.
Server side events.
--Of course something can be done with a RadAjaxManager function.
--But it would be more intuitive to handle events directly on the server.
--Preferred - "Before" and "After" events.
--Example OnFileMoving - OnFileMoved - and the first event has a Cancel in it's parameters.
--So I could disallow that a user drags an image to a document folder.
--"Full featured" event parameters would be a good idea
---"FileMoveEventArgs" has for an example "SourceDir" "DestinationDir" and so on.
--The reason why I'm asking for this is that on the server is that
-----a.) it is easier (for me as a .NET developer) to do things
-----b.) I have the full .NET power
-----c.) I have access to a lot of resources (check attributes of files / check user roles and so on)

Extending the context menu.
--Example: Imagine I have a "backup directory".
--When the user is in this directory I want to add a "Restore File" item to the menu

Full featured drag operations
--Currently I can move a file by dragging.
--In explorer I can either copy or move a file.
--This is done in two ways - Keyboard override / location dependant.
--If I drag from one drive to another it makes a copy
----This could be (since there is no drive) done via some rules (CopyOnDrag="True" or so) or at "different root nodes"
--MOST IMPORTANT - Keyboard override
------ If I hold CTRL in Explorer a file get's copied
------If I hold SHIFT a file get's moved

Regards

Manfred

answered on 09 Apr 2009, 09:58 AM

I agree with this, I have used the FileExplorer a lot recently for part of a CMS system whereby support users can create adverts - part of which is selecting an image, I have managed to implement it by keeping things fairly simple, sticking to read only and using other methods/UI for the admin of the files. The main limitation is certainly the lack of server side interaction. It would be nice to be able to loop through the items on load / "data bind" and 'do something' - such as hide folders with certain names etc without having to rely on few declarative settings and javascript. It would not need all of the server side features of a control like radgrid, but a few key ones would be useful.

Being able to do things like preselect something from serverside, access selected value from server side - without having to use a hidden field or textbox would be good for a start.

It is generally very good though, there is a lot of potential there.

Accepted

answered on 14 Apr 2009, 08:08 AM

Should've read the manual.
Thanks.
It would have saved me work: we added a ListBox where selected items were listed:

function OnClientItemSelected(sender, args) {

    LogEvent(args.get_item().get_path());
}

function LogEvent(text) {
    if (text != null) {
        imagestring=text;
        var opt=new Option(imagestring, imagestring);
        var selectList = $get("ListBox1");
        selectList.options[selectList.length] = opt;
        selectList.selectedIndex = selectList.length - 1;
    }
}

function removeFromSelectList() {
    var selectList = $get("ListBox1");
    if (selectList.selectedIndex != -1) {
        selectList.options[selectList.selectedIndex] = null;
    }
}

Using the CTRL key is far more elegant, of course.

answered on 20 Apr 2009, 02:29 PM

Another extension (from a current project need) would be to have different modes.
What I mean is:
a.) A "tree only" or "directories only" mode where only the treeview is visible
b.) A "content only" view - where the treeview is hidden (directory navigation only with (if shown) directory up)

Here a.) is most important.
I could imagine this as something like .TreeVisible / .DetailPaneVisible.

In addition (easier handling) an other idea is "only files in details" - so directories are only displayed in the tree
while in the details pane only files are visible.
This would enforce the user to use the treeview for directory navigation.
And save (on the developer side) some logic when checking what has been clicked in details pane (couldn't be a directory).

Regards

Manfred

answered on 20 Apr 2009, 02:51 PM

You are right Shaun - I know how I came to this idea.
I gave the VisibleControls a try - but than I had problems with a missing event (OnClientFolderLoaded) which enables me to make an Ajax request.
So I said to myself - I can't use this because I don't get the needed event.
And (logically) following ==> "the feature is missing" settled in my brain :)

To be more precise about the "missing event" - there is a "OnClientFolderChange" - but if you fire an Ajax Request while FileExplorer has to load something you'll get a "waiting indicator" that never disappears.
So handling this event is (currently) a bit "luck depended" -- if it is a single folder (with no subfolders) it works.
If the Explorer needs to load subdirs - bad luck :)

Thanks

Manfred

answered on 21 Apr 2009, 01:32 PM

Hi Manfred,

The OnClientFolderChange client event should fire if you only have a treeview visible. If it doesn't - we have a bug :)

I tested with the following code:

    
            <script type="text/javascript"> 
        
            function OnClientFolderChange(sender, args) 
        
            { 
        
                alert("folder change:"+args.get_item().get_path()); 
        
            } 
        
            </script> 
        
            <telerik:RadFileExplorer runat="server" OnClientFolderChange="OnClientFolderChange" ID="RadFileExplorer1" VisibleControls="TreeView"> 
        
                <Configuration ViewPaths="~/" DeletePaths="~/" UploadPaths="~/" /> 
        
            </telerik:RadFileExplorer>

It worked as expected.

If you get a waiting indicator that never disappears, this probably means that there was a server error during the AJAX request we made to update the FileExplorer. You can check the application event log on the machine and see the exception details or use a HTTP debugging proxy (Fiddler for IE, Firebug's Net view for Firefox) and see the exception details.

Best wishes,
Lini
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

answered on 21 Apr 2009, 01:50 PM

To clarify this:

I need server functionality.
To achieve this I call an Ajax function.
This works well - as long as FileExplorer is not also firing an Ajax request.

So to inform the server about a changed directory I use this approach:

    
            function OnFolderLoaded(sender, args) {  
        
                var item = args.get_item();  
        
                //inform the server that a new directory is the current one  
        
                TellServerAboutSelectedElement("DIR:" + item.get_path()); //signal dir got loaded  
        
            }  
        
            function TellServerAboutSelectedElement(argument) {  
        
                var ajaxManager = $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>");  
        
                ajaxManager.ajaxRequest(argument);  
        
            }

If i do this in OnClientFolderChange I get the "ever lasting load animation".
To be precise - I get this when the selected folder has subfolders and FileExplorer fires an Ajax call to read the subdirectories.

OnFolderLoaded fires AFTER FileExplorer did his Ajax - so it works always in this handler.
BUT - OnFolderLoaded does not fire when a directory is selected in the tree and the details pane is invisible.
Of course it doesn't - there is no folder to load.

Since we are a bit OT - back to the wishes:
It would be great to get "after events" - so for that OnClientFolderChange I see two solutions:
a.) an extra event OnClientFolderChangeCompleted
b.) fire the event AFTER the load of the subdirectories (when needed) took place.

Regards

Manfred

answered on 31 May 2009, 09:02 PM

Some additional suggestions for functionality/features

1) An additional column for "Modified Date" and "FiIe Type".

2) An additional ClientSelectColumn (checkboxes)

3) All columns should be hideable through a property.

4) I haven't tried this on a Mac, but what do people do as far as context menus are concerned?

5) The ability to create cusom context-menu commands for folders and items.

6) i think the folder list could be implemented in a sliding pane so that it can be closed (yet the tab will still be visible) or opened/pinned. This isn't amust have, or anything, but I think it might mimic Windows Explorer a little closer. Alternatively, there could be a toggle button at the top which will hide/show the folder list.

7) Ideally, the control should contain various "Template" sections, such as the Rad Grid's Command Template. This would make the top command area much easier to customize and would allow for the gratest flexibility. In fact, adding template sections in other areas would be very useful as well. For instance, there could be a "Footer" Template. By default this might show some statistics about the currently selected folder, but a user could obviously put whatever they wanted here.

8) I believe it has been mentioned, but the control needs server-side accesibility to events (particularly binding events) in order to customize individual items. For example, In many scenarios it would be necessary to provided different permissions on different folders or files

9) Ideally, it shouldn't be necessary to pop up a dialog to add a new folder. The tree node should just be added and go into Edit Mode (with the default foldername). The default folder name should be unique within the parent node, so if the template is "New Folder", the default new folder name will be "New Folder (1)", "New Folder(2)", etc if the name already exists in the branch. If the user tries to name the new folder with a name that already exists in the branch, or if they try to rename any folder within the branch with a name that is already being used, they should get a message prompting them to the problem.

10) IMHO, a "Preview" pane goes hand in hand with a file explorer. Yes we can implement one of our own as you do in some of your examples, but an integrated part of the control would make it much more powerful. Some file types are pretty straightforward to preview, such as images, html documents, flash, etc. Other file types, such as office documents, might be harder. I think there is a chance you could do these, but even if you couldn't, the integrated preview pane would be a great feature.

11) I'd like to see more in-depth examples and documentation for DB-based providers. While File System providers are important and an obvious start, I think one of the control's biggest benefits will be in putting a simple user interface on interracting with database file systems.

12) this one is a doozey, and maybe its too difficult, even for the brialliant minds at Telerik.. But one of the issues I have always come across with document management systems is the ability to edit documents online. Let's say you have built a DMS that stores a bunch of documents. If a user needs to modify these, even if a straightforward check-out/check-in system has been devised, the document still must be downloaded from the site (or opened in Word, Excel, or whatever), and then modified, and then saved to the user's desktop, and then uploaded back into the web site. it would be world chaning if there were a way to open the document in an Editor (similar to the Image Editor or Rad Editor you have), make the necessary modificatons, and the when the user clicks on "Save" in the editor, the changes are saved back to the file system, or more likely to a database back-end.Even if you weren't able to offer the full assortment of edit tools as Word or whatever the nascent application is, something like this could be immensely valuable. Even now, your Rad Editor product contains many of the most necessary capabilities as far as editing Word Documents. I am guessing that this would not be possible with many file types, but with Microsoft going to an xml-based framework with their Office2007 files, I am thinking this might become more of a reality at some point.

Anyhow, nice work so far. I am looking forward to future versions.

answered on 03 Jun 2009, 12:45 PM

Hello Albert,

Thank you for the suggestions - such features will indeed be useful in various scenarios. In my answer I will go over each of them and provide more specific feedback.

One important thing to be considered is the core logic behind the RadFileExplorer. And it is that, rather than building in each possible feature (which will make the control very heavy indeed) it is better to provide the ability to easily achieve a desired goal (as well as provide adequate examples, of course). Since the RadFileExplorer uses internally a number of other well-known Telerik products, such as RadGrid, RadToolBar, RadTreeView, etc, it can be seen that some of the features can be implemented by the developer working directly with these inner controls. They have been exposed as public properties to the RadFileExplorer already.

Here are my additional comments on your suggestions:

1) An additional column for "Modified Date" and "FiIe Type".
We are working on the ability for developers to be able to subclass the FileInfo class on the server and add new properties to it (which will automatically result in extra columns shown in the grid). This will allow developers to address any possible requirements and scenarios for extra columns.

2) An additional ClientSelectColumn (checkboxes)
Same as above

3) All columns should be hideable through a property.
You can do so even now by referencing the grid.

4) I haven't tried this on a Mac, but what do people do as far as context menus are concerned?
I am not sure where the problem with the context menus would be on a Mac. That said, if there is a problem, the context menu functionality is essentially duplicated by the options on the RadFileExplorer's toolbar.

5) The ability to create cusom context-menu commands for folders and items.
You can do so now, by accessing the ContextMenus objects.

6) i think the folder list could be implemented in a sliding pane so that it can be closed (yet the tab will still be visible) or opened/pinned.
You could probably try even now by accessing the RadSplitter object and its panes and replacing the first RadPane with a RadSlidingPane (and moving its Controls collection from former to latter).

7) Ideally, the control should contain various "Template" sections, such as the Rad Grid's Command Template.
You can access the RadGrid object and configure it in the manner you need.

8) I believe it has been mentioned, but the control needs server-side accesibility to events (particularly binding events) in order to customize individual items. For example, In many scenarios it would be necessary to provided different permissions on different folders or files.
For backwards-compatibility reasons, the abstraction behind the RadFileExporer is based on an earlier abstraction for the RadEditor FileBrowser dialogs. While the new control features more abilities, we chose the compatibility option to the brand-new-and-more-flexible approach. Hence, some things are possible to improve, but there can sometimes be limitations set by the overall architecture, or at least the way of achieving a scenario might not be the most straightforward one.

9) Ideally, it shouldn't be necessary to pop up a dialog to add a new folder. The tree node should just be added and go into Edit Mode (with the default foldername).
We will consider this for implementation.

10) IMHO, a "Preview" pane goes hand in hand with a file explorer. Yes we can implement one of our own as you do in some of your examples, but an integrated part of the control would make it much more powerful.
We plan to extend the RadFileExplorer architecture to allow for easy integration of Preview panes, as well as (several) default previewers. I am not able to tell you at this point how it will end up, and when it will appear but someting like that will appear for sure.

11) I'd like to see more in-depth examples and documentation for DB-based providers. While File System providers are important and an obvious start, I think one of the control's biggest benefits will be in putting a simple user interface on interracting with database file systems.
With Q1 2009 SP2 we provided extensive new documentation for the RadFileExplorer control, please check it out here:
http://www.telerik.com/help/aspnet-ajax/radfileexplorer-overview.html
and
http://www.telerik.com/help/aspnet-ajax/radfileexplorer-custom-filebrowsercontentprovider.html

12) this one is a doozey, and maybe its too difficult, even for the brialliant minds at Telerik.. But one of the issues I have always come across with document management systems is the ability to edit documents online.
This goes beyond the current scope of the control, but certainly such (existing, independent) document editors can be easily attached/plugged into the current RadFileExplorer implementation even now.

Best wishes,
Tervel
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

answered on 24 Jun 2009, 11:23 AM

Hi I have a few questions -

Do you have any indication of how soon the ability for developers to be able to subclass the FileInfo class on the server and add new properties to it will be available? I'm considering buying these tools to implement a change for one of my customers however one of their main requirements is to show the date column for each file.

With the current version can I manually add a column called "date" and affix a value for each file. This does not have to be the actual date modified value but the date for when the internal contents of a document are relevant to.

Also does this control have to be driven from an actual folder path on a harddisk? The reason why I ask is because the customer has files in a database that I need to read out and present in a view like this. So no actual folder structure exists, I will need to just give the illusion that one exists and virtually create it on the fly when the page loads.

- Would you suggest manually combining the RAD treeview with the RAD Grid control would be more appropriate?

Thanks
James Sharpe

answered on 04 Nov 2009, 07:20 AM

I realise I may be missing something as I would have thought this would be a feature that everyone would be screaming for...

I would like to be able to databind the control in databound controls (grids, datalists, etc...). When building custom CMS's for clients, selecting, uploading and managing image files is a common chore and one which is a bit of a pain as it involves linking filesystem data with db data.....being able to use it 'inline' as a fle selector rather than implementing a pop up would be so much help...

Eg. Implementing it as a separate pop-up gets tricky when trying to edit data (such as an employee record) in a detailsview or formview control, as I'm yet to find a way to get the javascript to be able to correctly assign the file path to the target textbox within the edititemtemplate or insertitemtemplate

I'm certainly not an expert with the Telerik controls yet, mostly as the javascript side of things holds me back...but I would think having a databindable property such as filepath that you could bind to in controls would be a simple and obvious feature to include.

If anyone knows how to get around this for the above example I'd love to hear it...its doing my brain in!

answered on 09 Nov 2009, 03:59 PM

Hello Trent,

The RadFileExplorer control cannot be bound using the standard DataBind mechanism. Instead you can connect the control to any data source, but you need to implement a custom FileBrowserContentProvider. Fortunately, there an already implemented provider that connects the FileExplorer to SQL database. Please check this online demo for more information. The implementation of the Telerik.Web.Examples.DBContentProvider class can be found on your hard drive in : InstallDir\Telerik\RadControls for ASPNET AJAX Q3 2009\Live Demos\FileExplorer\Examples\DBFileBrowserContentProvider folder.

I hope this helps.

All the best,
Fiko
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

answered on 17 Nov 2009, 12:39 PM

Hello Trent,

This scenario is not covered by the RadFileExplorer control, because you need to assign a value to its Paths properties after the parent control (Grid, ListView etc.) is databound. The DataBound event, however is fired after the PageLoad event, and FileExplorer persists its properties values only when they are set latest in the Page_Load event. An example of using a databound control is the DrobDown one. When using this component you could get the selected value in the Page_Load event as well (before the SelectedIndexChanged event):

ASPX:

protected void Page_Load(object sender, EventArgs e)

{

string value = RadComboBox1.SelectedValue;

if (value == "UK")

{

string virtPath = "VirtualPathTo UK folder";

RadFileExplorer1.Configuration.ViewPaths = new string[] { virtPath };// Pass the selected path

}

else if (value == string.Empty)

{// First load ==> no selected item

string virtPath = "VirtualPathTo USA folder";// Initial path

RadFileExplorer1.Configuration.ViewPaths = new string[] { virtPath };// Pass the initial path

}

I hope this information will be of help for better understanding of how the RadFileExplorer control works.

Please do not hesitate to contact us if you have any further questions.

Greetings,
Fiko
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

answered on 11 Aug 2010, 03:21 PM

Hello Thai,

In this cases I recommend you to enable the Paging feature of the RadFileEplorer control. You can do this by setting the AllowPaging="true" and optionally you can specify the page size by using the PageSize property. These settings will enable the paging feature of the Grid, embedded in the RadFileExplorer controls.

Also, I recommend you to check the <compilation> element in the web.config file. If its debug property is set to true then I recommend you to set it to false. This will increase the performance of the application as well.

I hope this helps.

All the best,
Fiko
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

answered on 14 Jun 2011, 05:36 PM

I realize this is an old thread but I haven't been able to find any further information regarding the original posters initial suggestion: an ability to relabel or alias a folder name in the RadFileExplorer.

Was this ever implemented or does anyone know of a possible work around? I've gotten so far as to create the viewPaths using a "name|path" structure, and then in my custom FileSystemProvider was able to split that value when creating DirectoryItems. However, because I couldn't perform the split and repopulate the viewPaths with valid file paths prior to the constructor being called, it doesn't seem any of the file navigation works. Has anyone been able to come up with a solution for this?

answered on 17 Jun 2011, 11:30 AM

RadFileExplorer.zip

Hello Matt,

Please, find attached a sample working project that demonstrates a similar scenario to yours. RadFileExplorer creates folders and files dynamically in the code from the existing physical directory.
Pysical Directory contains all the files. File name contains three parts seperated by '__', three parts should be read and created as folders.

Note that this is a getting started example which you can use as a base to implement your scenario.

Kind regards,
Rumen
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

answered on 31 Oct 2012, 11:41 AM

FileExplorer-createFolder-aspx.zip

Hi Rohan,

the desired scenario could be achieved by using the FileExplorer's createNewDirectory() method. It expects two parameters:

the path where the folder to be created
the name of the new folder

For your convenience I am attaching a sample project demonstrating the approach. I have added an additional Textbox where I take the name of the new folder from, and a button which is firing the creation of the new folder (in the current one).

Kind regards,
Vesi
the Telerik team

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.