Vista like File explore

[srikanth]

HI Telerik,

I am looking for a file explorer for web application (web page) which should look like vista explorer or your FirstLook exploerer at http://demos.telerik.com/aspnet-ajax/fileexplorer/examples/default/defaultcs.aspx. Do you have any sample code to go ahead with this control? Can i add my own button in the menu? I would prefer vista explorer but i am ok with the example provided also. Could you please suggest me regarding this? I am using  Rad file explorer for the first time and does not have much idea about its properties, how to bind etc.
Please do the needful ASAP.

Regards,
Srikanth

[srikanth]

Hi Telerik,

I need to bind the Treeview in RadFile explorer with the data provided by service(This could be a hierarchical XML string) and also on selection of a node in the tree view i need to show the selected node information in the RadGrid. Again the datasource to load the grid is coming from a service. How could i acheive it?

What is RadFileExplorer1.Configuration.ViewPaths ? How can i configure this to my datasource or to any machine folder??

[Fiko]

Hi Srikanth,

RadFileExplorer does not use the standard faultfinding mechanism. Instead, you need to implement a custom FileBrowserContentprovider, which is used as to serve the data to the RadFileExplorer control.
In your case I recommend you to check all these resources:

• http://www.telerik.com/help/aspnet-ajax/radfileexplorer-configuration.html
• http://www.telerik.com/help/aspnet-ajax/radfileexplorer-client-side.html
• http://www.telerik.com/help/aspnet-ajax/radfileexplorer-server-side-programming.html
• http://www.telerik.com/help/aspnet-ajax/radfileexplorer-add-custom-button-context-menu-item.html
• http://www.telerik.com/help/aspnet-ajax/radfileexplorer-adding-custom-columns.html

These are already implemented custom providers.

I hope this helps.


Sincerely yours,
Fiko
the Telerik team

[srikanth]

Hi telerik,

I got some example where using DBContentProvider i could connect to a DB and show the items on the tree. However i did not get how to set or configure only the directories in the treeview of fileexplorer and only files in the rad grid. its like when i click on any particular directory/subdirectory it should list me the files under it in the grid and not any subfolders.
For example,
If folder1 has folder2 as child directory and abc.txt,xyz.txt non-directory files, the grid should display only the files (abc.txt and xyz.txt) and should not display folder2 in grid.

Could you tell me how to configure fileExplorer for this?

Regards,
Srikanth

[srikanth]

Hi Telerik,

I need to know in FileExplorer,
How to

1. handle treeView node click event at the server side
2. Populate grid only with files and no folders.
3. do ondemand loading of data grid since my application involves displaying huge number of rows in data grid - something like rebind     data on scrolling, Is it available by default? becasue right now the application hangs if it has to show 300 + items in grid.
4.  get the deselected row in the Grid. I need to disable certain custom tool bar buttons based on no.of items deselected.
5. treeView node click event  is not triggered if added inside post back handler but the same is triggered multiple times causing infinite auto refresh of the tree view as well as grid 

     i.e,
if (!IsPostBack)
        {

RadFileExplorer1.TreeView.NodeClick += new RadTreeViewEventHandler(TreeView_NodeClick); // not triggered when a node is clicked
}

if (!IsPostBack)
        {

     ///// Some code
}
else
{
RadFileExplorer1.TreeView.NodeClick += new RadTreeViewEventHandler(TreeView_NodeClick);
// triggered multiple times when a node is clicked once and hence the tree view and grid keep on refreshing.
}


I hope we could get a better and faster support on all our queries.

[Fiko]

Hello Srikanth,

In reference to your questions:

1. In reference to your 1) and 5) questions:
   The RadFileExplorer control encapsulates the embedded controls (RadTreeView RadGrid, etc.) and only some features of the embedded controls are exposed and can be used. The OnNodeClick event, however, cannot be used, because the RadFileExplorer control overrides the default behavior of that event. In your case you can use the OnClientFolderChange event of the RadFileExplorer control and implement your custom logic which will execute a server-side code when this event occurs.
2. I recommend you to use this approach in order to remove the folder from the RadGrid:
   
   • Attach a handler to the OnExplorerPopulated event
   • Implement the handler as shown bellow:
     

     protected void RadFileExplorer1_ExplorerPopulated(object sender, Telerik.Web.UI.RadFileExplorerPopulatedEventArgs e)
     {
         if (e.ControlName == "grid")
         {
             e.List.RemoveAll(item => (item is DirectoryItem));
         }
     }

3. RadFileExplorer uses Laod-On-Demanld approach in order to load its content so this is provided out-of-the-box. In your case I recommend you to enable Paging feature of the Embedded Grid by setting the RadFileExplorer's AllowPaging="true" property. Optionally, you can set the page size as well by setting a value to the PageSize property of the control. This will significantly reduse the loading time of the control.
4. You need to use the RadFileExplorer's OnClientItemSelected event. Then you can get the selected FileExplorerItem (you do not need to use the Grid's API) and hide or show the commands on the ToolBar using the RadToolBars client-side API. You can get reference to the toolbar embedded in the RadFileExplorer control by using its get_toolbar() method. Then you can find the desired toolbar item (the values of the toolbarItems are: "Delete" for "Delete" command, "Upload" for the Upload command, etc.)  and change its state (using its set_enable method).
   
   

I hope this helps.

Kind regards,
Fiko
the Telerik team

[srikanth]

Hi Telerik,

Thank you for your support and the explorer is taking a good shape for us and we are thinking to buy the license very soon. Filtering folders from the grid of FileExplorer worked fine. However my question about client/serverside event when a particular row is deselcted using a control (ctrl) key is not cleared.
Please look at these queries about FileExplorer control,

1. In my application i have few custom gridcontext menus. when ever i select a single item or multiple items in the the grid, i need to get the selected item/s name/path/url. How could i achieve this at the client side or at server side when i  click on the grid context menu? its like get all the selected items in the gridcontext menu event.
2. Related to my above query, after selecting multiple items in the grid and again deselcting one or two using ctrl key, how do i fetch all selected items on gridcontext menu click? For example, i have selected item1,item3 and item7. I need to get the selected items Path/URL now.
3. The File explorer has Rename/NewFolder/Delete context menus in built and on clicking the same corresponding event takes place. Similarly, i have custom button Rename in the Fileexplorer tool bar. I need to configure this click event with the same context menu 'Rename' event. How could i achieve this?
4. The fileexplorer toolbar does allow custom RadToolbarButtons. However i am planning to place a RadComboBox at the extreme end of the control using which i want to configure the PageSize of the fileexplorer grid. Is it possible to add this control inside FileExplorer toolbar? If this is not possible then is it possible to have pageSize combobox (which is provided with RadGrid as shown at http://demos.telerik.com/aspnet-ajax/grid/examples/programming/custompaging/defaultcs.aspx) in fileexplorer pagination?
5. I am showing FileExplorer in a RadWindow with  ExplorerMode="FileTree" so that it display only TreeView. Also i do not want to allow multiple node selection using ControlKey (Ctrl). I have set the RadFileExplorer1.TreeView.MultipleSelect = false in my code behind but still i am able to do multi selection. How could i prevent this? is this a known behavior?
6. The fileexplorer splitter does allow you to move the panes towards the right extreme. but the Explorer has pagination and on pulling the split bar towards right extreme grid shrinks except the Pagination slider at the bottom. The slider goes out of bound. This is happening only in IE (currently i am using IE8). In firefox,chrome and safari it seems to be working fine. I have attached the snapshot of the same. Is there a way to fix the movement of the split bar upto certain width and stop?

Looking forward for your response.

Regards,
Srikanth

[srikanth]

Hi,

I am looking forward for your answers for my previous post.
 Also i am facing problem after refreshing the FileExplorer. I have custom tree context menu called 'Import'. Onclick of this context menu i am opening one rad window where i am providing the  user some option like in a check box and on click of OK in that window it is returned to parent. In my onClientClose javascript of RadWindow, i am calling server side method using a button which is inside a RadAjaxPanel. On the serve side code of button click event i execut some API and later i will call client side javascript again to refresh the file explorer. Everything works fine only for the first time. Once the file explorer is refreshed, the next time onwards, i get a context menu but onclick of that menu, the client side handler is not called instead it just refreshes the file explorer.

1. How could i refresh the file explorer after executing myy server side API?
2. How do you get the right clicked node path of the Fileexplorer?
3. How to change the image of selected tree node?

Here is my sample code where i am calling client side method to refresh the fileexplorer. this works only first time. After first refresh, this wont call the treeContextMenu click event to trigger my popup.
//Button click event inside a RadAjaxPanel

 

protected void btnImport_Click(object sender, EventArgs e)

 

{

 

try

 

{

string

 

query = "RefreshExplorer()";

 

RadAjaxPanel1.ResponseScripts.Add(query);

 

}

 

catch (Exception)

 

{

}
//Client side method called from code behind

 

function

 

RefreshExplorer() {

 

 

var radExplorer = $find('<%= RadFileExplorer1.ClientID %>');

 

 

var radAjaxPanel = $find('<%=RadAjaxPanel1.ClientID %>');

 

 

var source = "ROOT/Nature"; //radExplorer._tree.get_selectedNode()._getNodeData().Value;

 

 

 

 

 

radExplorer.set_currentDirectory(source);

radExplorer.refresh();

}

In my applicationHandler [<telerik:RadFileExplorer ID="RadFileExplorer1" runat="server" OnClientLoad="applicationLoadHandler" ],
i am calling

 

var tree = radExplorer.get_tree();

 

tree.add_contextMenuItemClicked(treeContextMenuClicked);

[Fiko]

Hello Srikanth,

In reference to your questions:

1. "In my application i have few custom gridcontext menus. when eve...."
   and
   "....how do i fetch all selected items on gridcontext menu click? For example, i have selected item1,item3 and item7. I need to get the selected items Path/URL now."
   
   I believe that these resources will be of help for you:
   
   • http://www.telerik.com/support/kb/aspnet-ajax/fileexplorer/custom-field-in-the-grid-s-context-menu.aspx
   • http://www.telerik.com/support/kb/aspnet-ajax/fileexplorer/pass-all-of-the-selected-items-paths-to-the-server.aspx
2. "I need to configure this click event with the same context menu 'Rename' event. How could i achieve this?"
   In the ToolBar's click handler, you need to get reference to the RadFileExplorer control. Then use its client-side API in order to get the reference to the embedded TreeView. After that you can get the selected node (treeView.get_selectedNodes()[0]) by using the RadTreeView's API and call the Treenode's startEdit method (treeNode.startEdit())
3.  "The fileexplorer toolbar does allow custom RadToolbarButtons. However i am planning to place a RadComboBox at the extreme....."
   I believe that these articles will be of help:
   
   • http://www.telerik.com/community/code-library/aspnet-ajax/file-explorer.aspx
   • http://www.telerik.com/community/code-library/aspnet-ajax/file-explorer/enable-filtering-in-the-grid-embedded-in-radfileexplorer.aspx
   • http://www.telerik.com/community/code-library/aspnet-ajax/file-explorer/how-to-add-a-custom-button-to-the-toolbar-and-hide-an-existing-one-s.aspx
4. "I have set the RadFileExplorer1.TreeView.MultipleSelect = false in my code behind but still i am able to do multi selection...."
   
   You need to set the TreeView's MultipleSelect  after the PagePrerender event. The best place to do this is the OnPreRenderComplete:
   

   protected override void OnPreRenderComplete(EventArgs e)
   {
       base.OnPreRenderComplete(e);
       RadFileExplorer1.TreeView.MultipleSelect = false;
   }

5. "The slider goes out of bound. This is happening only in IE..."
   For some reason the attachment did not go through. Could you please attach it again?
6. "How could i refresh the file explorer after executing myy server side API?"
   In general you need to use radExplorer.refresh(); in order to refresh the RadFileExplorer. Unfortunately the provided information is not enough for me to determine the exact reason for the behavior that you experience. Could you please isolate this issue in a small project, open a new support ticket and send it to me? I will check it and do my best to provide a working solution as soon a possible.
7. "How do you get the right clicked node path of the Fileexplorer?"
   You need to attach a handler to the OnClientContextMenuShowing event of the embedded RadTreeView:
   

   protected void Page_Load(object sender, EventArgs e)
   {
       RadFileExplorer1.TreeView.OnClientContextMenuShowing = "OnTreeContextMenuShowing";
   }

   
   Then you can get the path of the selected item as shown beloow:
   

   <script type="text/javascript">
       function OnTreeContextMenuShowing(oTree, args)
       {
           var pathToItem = args.get_node().get_value();
           var itemName = args.get_node().get_text();
           alert(itemName);
       }
   </script>

8. "How to change the image of selected tree node?"
   In RadFileExplorer we use sprites for all the icons, but there is not a different icon that is applied to the selected folder. I have prepared this demo, however, which shows how to dynamically change the icon of the selected RadFileExplorer's folder.

I hope this helps.

Best wishes,
Fiko
the Telerik team

[srikanth]

Hi,

The file explorer controll takes a long time to bind sometimes and as a result my application hangs. Also there are few cases where the loading image keep on rotating without an end. Please note that the file explorer control is not embedded inside any update panel.

• 1. When i double click on back or forward button of tool bar control, it starts binding with loading image and this doesnt stops even after minutes. This usually happens when i do second click during the time of loading.
  2. The same problem happens when i click on refresh button.
  3. When i do multi file selection using Ctrl key on grid, the selection of rows is very slow.

  What is the reason for this behavior?

How do i make rendering mode as 'Block' so that none of the controls (Tree,Toolbar and Grid) could be accessable once the explorer loading panel starts loading the image and make control available only after loading is complete.

• In RadGrid i am using GridBoundColumn as a DateTime column and i have set the data type property as 'System.DateTime'. I have enabled the filtering on this column and the date format what i am using is '02-Sep-2010 12:39:05 PM'. The data grid is showing this record also but when i give the exact string in filter text and apply 'Equal To' from the context menu, it wont return any value and the data grid says no records available though there are records. Is this a known issue or any alternative is available to make it work?

[Rohan]

Hi all,
When i double click on back or forward button of tool bar control, it starts binding with loading image and this doesn't stops even after minutes. This usually happens when i do second click during the time of loading.
how to stop this ........

[Vessy]

Hi Rohan,

This behavior is caused by the fact that two AJAX requests are initiated at the same time and respectively they are canceling each other. Unfortunately, this is a limitation that stems from the AJAX Framework and we are not in position to suggest you any suitable workaround (except for disabling the double-clicking).

All the best,
Vesi
the Telerik team