如何在aspx页面上显示可点击目录而不动态添加控件作为子文件夹

Question

I created an aspx website which shows a directory with its content from a FTP-Server. If I click a folder inside this directory, it should display the content of the sub directory and so on.

What I have tried so far is to display the content of a directory as dynamically createt WebControls.Button. Those buttons have a onclick event difined in the c# code behind.

This is a bad idea because of the following reason:

Creating new dynamically controls after a postback (clicking on a folder) prevents any onclick event , added to the sub directory buttons, to work. This is, because controls need an unique ID that eventhandling works properly.

Let me explain this with an example:

• First page load -> every directory displayed gets an ID (1-7) and an onclick event assigned.

Scenario 1:

• Opening folder "Europe" with the ID 1 -> onclick event gets fired -> the sub directories will be loaded in codebehind, displayed and get an ID (1- ..) and an onclick event assigned.

• Opening the subfolder "Andorra" with ID 1 -> onclick event gets fired -> But now the parent folder "Europe" will be opened, because it already had ID 1.

Scenario 2

• Opening folder "Europe" with the ID 1 -> onclick event gets fired -> the sub directories will be displayed, but now we assign new IDs (6-..) and the onclick event.

• Opening the folder "Andorra" with the ID 6 -> onclick event does not get fired (event mechanism seems to be confused about the new ID) -> instead all the added buttons (directories) dissapear from the page.

Additional Info: To know which button is clicked, I save the path in the Button.CommandArgument parameter, so the codebehind knows which directory to load from the FTP.

I really have no more ideas how to realize a simple clickable directory in asp.net. I hope you understant the struggle and may have an idea to share :)

Answer 1

Ok, here is what you do. Lets drag a button on a blank web form. Next, drag and drop in a treeview.

On the treeview control, select this option: (auto format)

Now, you don't have to do the above auto format. All it does is "set up" the icons for a treeview. The built in list has typical bullets or > etc. And these are "just" settings in the property sheet for you. (you can use your own icons, but this sets them up for you).

Ok, so far, zero code.

Now, for our code behind the button to fill the treeview.

Dim myFiles As List(Of String) = GetAllFtpFiles(fRoot, UserId, Passwrod)
Call PopulateTreeViewFiles(fRoot, myFiles, "", Nothing)

The routine GetAllFtpFiles simple returns a list of files at a given starting folder. So fRoot would be

"ftp://ftp.mywebsite/startingFolder/"  (we do assume trailing /)

We then call PopulateTreeViewFiles. All it does add the list of base files. Now we COULD populate the WHOLE tree, but that can take a bit of time, so we only populate folders when clicked on.

So, the GetAllFtpFiles simple returns a list of files. I am sure you ALREADY have your own FTP file get/grab/fetch routine, but here is the one I used:

Private Function GetAllFtpFiles(ByVal ParentFolderpath As String, UserId As String, Password As String) As List(Of String)
    Try
        Dim ftpRequest As FtpWebRequest = CType(WebRequest.Create(ParentFolderpath), FtpWebRequest)
        ftpRequest.Credentials = New NetworkCredential(UserId, Password)
        ftpRequest.Method = WebRequestMethods.Ftp.ListDirectory
        Dim response As FtpWebResponse = CType(ftpRequest.GetResponse(), FtpWebResponse)
        Dim streamReader As StreamReader = New StreamReader(response.GetResponseStream())
        Dim directories As List(Of String) = New List(Of String)()
        Dim line As String = streamReader.ReadLine()

        While Not String.IsNullOrEmpty(line)
            directories.Add(line)
            line = streamReader.ReadLine()
        End While
        streamReader.Close()
        Return directories

    Catch ex As Exception
        Return Nothing
    End Try

 End Function

As noted, it just returns a list for a given folder.

Next up, the routine to add to the treeview.

Sub PopulateTreeViewFiles(fRoot As String, dtParent As List(Of String), parentId As String, treeNode As TreeNode)

    For Each sFile As String In dtParent
        Dim sFileOnly As String = Replace(sFile, parentId, "")
        Dim child As New TreeNode() With {
         .Text = Replace(sFileOnly, "/", ""),
         .Value = fRoot + sFileOnly
        }
        If InStr(sFileOnly, ".") <> 0 Then
            child.ShowCheckBox() = True         ' is a file - no expand
        Else
            child.PopulateOnDemand = True       ' is folder - allow expand
        End If
        If parentId = "" Then
            TreeView1.Nodes.Add(child)          ' empty tree - add to base tree
        Else
            treeNode.ChildNodes.Add(child)      ' user clicking on a node
        End If
    Next

End Sub

And that's it!!

The resulting screen looks like this:

So now you have a treeview based on FTP.

Note that each file does have a check box, so you can select as many files as you want, and then use the selected collection of the tree view.

So, not a lot of code, but the treeview is "dynamic". Note that we could fill the WHOLE treeview at the start (just move the ondemand code routine to the main routine), but as noted, this can slow things down a lot. This way, we ONLY pull + populate the starting folder, so it should work quite fast.

I don't have this in c#, but the above is simple enough You could send the above routines though a vb to c# converter, but the code is not complex, and is quite "basic". And the FTP code could be perhaps replaced with your own.