yahooThis sample will demonstrate how to quickly build a simple Yahoo! style navigation bar that displays the paths a user has taken to get to a given directory, and also displays a table of links to the sub-directories of the current directory.

The first thing I like to do when beginning any database driven application is to design the data structure. Of course, once we get into writing the code, many times columns or tables need to be added or modified from the initial design, but having a data framework helps to give us some focus and direction.

Database Layout
I am using an Access2000 database for this example. You can definitely port this to any RDBMS easily; just follow the same table architecture.

Let's start by creating a new Access database, and name it Bread.mdb.
Create a single table and name it tblParents.
Open it up in Design Mode and add the following columns.


* You can skip building all this from scratch by downloading the source files.

Bread.mdb
Column Name Data Type
AID Auto Number (Primary Key)
DirName Text
ChildDir Text
ParentDir Text
ChildDirDescript Memo
DirDescript Memo

* If designing for SQL Server, make the AID Column an Identity Field, with an increment of 1 and make sure allow nulls is off.

Next we will want to populate our table with data, so let me explain the logic of the architecture.

Start by inserting the data for the root directory of your web server. This will be specified by inserting a forward slash / into the DirName column.
Next add the directory below the root to the ChildDir column (make sure you add the exact directory name as it appears on the server)
Since this is the root directory, leave the ParentDir column blank.
For the ChildDirDescript Column, you want to enter whatever you want the text to read for the link to the ChildDir directory that you just entered. (i.e., if you entered music as a ChildDir Name, you may want the link that points to music to also read Music, so you enter Music in the ChildDirDescript column for this entry. If you want it to read Modern Music, enter that)
For the DirDescript column, enter the text you want to appear to describe the current directory, which in this case is the root folder. I used the word Home as the description so that users will always know that clicking on this link will bring me back to the beginning.
Repeat this process for each sub directory you have below your web root.
Note: Make sure to create the actual directory structure on the web server if it does not already exist.
Your data should look similar to this:




After you complete this process make sure you also make entries in the database for the directories you just added. In my case I added a directory Music, so now I must add the appropriate Fields for Music. Since Music has a parent directory (Root), we must specify it by adding a forward slash for ParentDir.

Populate the data for Music and any other Sub Directories you like.

You may refer to the screenshot below for my example.




* The ChildDir columns should contain all the directories below the Root.

The Code
Now that we have some valid data, let's start by creating a couple of functions. We will house these functions in an include file, named folderFunctions.asp. The first function we want is a function to return the current physical directory of the web server. We will use this function when we do a database lookup to build the appropriate links and path history. I named this function GetThisPath.

First thing our function needs to do is get the current full path from the server. We will use the Path_Info method of the ServerVariables collection to look it up.

Since we only want the current directory name, we will split the string returned from Path_Info at the forward slash, which will create an array containing all the directories above the current directory. Then we will need to loop thru the entire array to pull only the data we need (the current directory). We will accomplish this by setting our loop to exit at the next to the last entry in the array (The very last entry would be the page name and we don't want that). The way we do this is to tell the loop to execute as many times as values the array holds minus one. We get that information by asking the array for it's upper Bounds.

Then we will set the functions return value to the last entry in our loop by overwriting the return value in each loop, which will be the current directory. However, if the array is empty, it means we are at the root of the server and we need to set the return value