Allow Files to Open from TreeView Control in C#

This tutorial will show you how to use the TreeView control to allow clicking of files to open from your web browser. C# version.

The TreeView control is very versatile, in that we can assign a variety of sources to it and it will display in the same way - showing us a hierarchical structure of the data source.
In this tutorial, we will be looking at how we can use the TreeView to display a directory of our website and how to make the files clickable so that we can open them up from the browser.

The first thing we need to do is create our ASPX page. We will add a TreeView control:

<form id="form1" runat="server"> <asp:TreeView ID="TreeView1" runat="server" OnTreeNodePopulate="TreeView1_TreeNodePopulate" AutoGenerateDataBindings="False" ExpandDepth=0> <Nodes> <asp:TreeNode Value="C:" Text="media" SelectAction="Select" PopulateOnDemand="true"></asp:TreeNode> </Nodes> </asp:TreeView> </form>

We chose Server Intellect for its dedicated servers, for our web hosting. They have managed to handle virtually everything for us, from start to finish. And their customer service is stellar.

We set the initial Value of the TreeNode to the C drive, but we will change this on Page Load:

protected void Page_Load(object sender, EventArgs e) { TreeView1.Nodes[0].Value = Server.MapPath("media"); }

And we also add the following method to populate the TreeView:

protected void TreeView1_TreeNodePopulate(object sender, TreeNodeEventArgs e) { if (IsCallback == true) { if (e.Node.ChildNodes.Count == 0) { LoadChildNode(e.Node); } } } private void LoadChildNode(TreeNode node) { DirectoryInfo directory = null; directory = new DirectoryInfo(node.Value); foreach (DirectoryInfo subtree in directory.GetDirectories()) { TreeNode subNode = new TreeNode(subtree.Name); subNode.Value = subtree.FullName; try { if (subtree.GetDirectories().Length > 0 | subtree.GetFiles().Length > 0) { subNode.SelectAction = TreeNodeSelectAction.SelectExpand; subNode.PopulateOnDemand = true; subNode.NavigateUrl = "#"; } } catch (Exception ex) { } node.ChildNodes.Add(subNode); } foreach (FileInfo fi in directory.GetFiles()) { TreeNode subNode = new TreeNode(fi.Name); node.ChildNodes.Add(subNode); subNode.NavigateUrl = "media/" + fi.Name.ToString(); //subNode.NavigateUrl = Server.MapPath(fi.Name.ToString()); } }

We moved our web sites to Server Intellect and have found them to be incredibly professional. Their setup is very easy and we were up and running in no time.

Here, we are loading every file and folder into the TreeView. Visual Studio will take care of the PostBack links for folders, but for files (ChildNodes), we assign the NavigateUrl ourselves. Note that the comment can be used instead to provide the full URL when on a Web Server.
Now if we run this web application, we should be able to click on the files listed to open them directly from our browser.

The entire code-behind looks something like this:

using System; using System.Configuration; using System.Data; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.IO; public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { TreeView1.Nodes[0].Value = Server.MapPath("media"); } protected void TreeView1_TreeNodePopulate(object sender, TreeNodeEventArgs e) { if (IsCallback == true) { if (e.Node.ChildNodes.Count == 0) { LoadChildNode(e.Node); } } } private void LoadChildNode(TreeNode node) { DirectoryInfo directory = null; directory = new DirectoryInfo(node.Value); foreach (DirectoryInfo subtree in directory.GetDirectories()) { TreeNode subNode = new TreeNode(subtree.Name); subNode.Value = subtree.FullName; try { if (subtree.GetDirectories().Length > 0 | subtree.GetFiles().Length > 0) { subNode.SelectAction = TreeNodeSelectAction.SelectExpand; subNode.PopulateOnDemand = true; subNode.NavigateUrl = "#"; } } catch (Exception ex) { } node.ChildNodes.Add(subNode); } foreach (FileInfo fi in directory.GetFiles()) { TreeNode subNode = new TreeNode(fi.Name); node.ChildNodes.Add(subNode); subNode.NavigateUrl = "media/" + fi.Name.ToString(); //subNode.NavigateUrl = Server.MapPath(fi.Name.ToString()); } } }

Looking for the VB.NET version? Click here!

Looking for more ASP.NET Tutorials? Click Here!