Allow Files to Open from TreeView Control in VB.NET

This tutorial will show you how to use the TreeView control to allow clicking of files to open from your web browser. VB 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>

If you're looking for a really good web host, try Server Intellect - we found the setup procedure and control panel, very easy to adapt to and their IT team is awesome!

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

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load TreeView1.Nodes(0).Value = Server.MapPath("media") End Sub

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

Protected Sub TreeView1_TreeNodePopulate(ByVal sender As Object, ByVal e As TreeNodeEventArgs) If IsCallback = True Then If e.Node.ChildNodes.Count = 0 Then LoadChildNode(e.Node) End If End If End Sub Private Sub LoadChildNode(ByVal node As TreeNode) Dim directory As DirectoryInfo = Nothing directory = New DirectoryInfo(node.Value) For Each subtree As DirectoryInfo In directory.GetDirectories() Dim subNode As New TreeNode(subtree.Name) subNode.Value = subtree.FullName Try If subtree.GetDirectories().Length > 0 Or subtree.GetFiles().Length > 0 Then subNode.SelectAction = TreeNodeSelectAction.SelectExpand subNode.PopulateOnDemand = True subNode.NavigateUrl = "#" End If Catch ex As Exception End Try node.ChildNodes.Add(subNode) Next subtree For Each fi As FileInfo In directory.GetFiles() Dim subNode As New TreeNode(fi.Name) node.ChildNodes.Add(subNode) subNode.NavigateUrl = "media/" & fi.Name.ToString() 'subNode.NavigateUrl = Server.MapPath(fi.Name.ToString()); Next fi End Sub

We are using Server Intellect and have found that by far, they are the most friendly, responsive, and knowledgeable support team we've ever dealt with!

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:

Imports System.IO Partial Class _Default Inherits System.Web.UI.Page Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load TreeView1.Nodes(0).Value = Server.MapPath("media") End Sub Protected Sub TreeView1_TreeNodePopulate(ByVal sender As Object, ByVal e As TreeNodeEventArgs) If IsCallback = True Then If e.Node.ChildNodes.Count = 0 Then LoadChildNode(e.Node) End If End If End Sub Private Sub LoadChildNode(ByVal node As TreeNode) Dim directory As DirectoryInfo = Nothing directory = New DirectoryInfo(node.Value) For Each subtree As DirectoryInfo In directory.GetDirectories() Dim subNode As New TreeNode(subtree.Name) subNode.Value = subtree.FullName Try If subtree.GetDirectories().Length > 0 Or subtree.GetFiles().Length > 0 Then subNode.SelectAction = TreeNodeSelectAction.SelectExpand subNode.PopulateOnDemand = True subNode.NavigateUrl = "#" End If Catch ex As Exception End Try node.ChildNodes.Add(subNode) Next subtree For Each fi As FileInfo In directory.GetFiles() Dim subNode As New TreeNode(fi.Name) node.ChildNodes.Add(subNode) subNode.NavigateUrl = "media/" & fi.Name.ToString() 'subNode.NavigateUrl = Server.MapPath(fi.Name.ToString()); Next fi End Sub End Class

Looking for the C# version? Click here!

Looking for more ASP.NET Tutorials? Click Here!