View Full Version : Collapsing Vertical Menu

09-12-2006, 01:48 PM

I am trying to create a collapsing vertical menu (with nested submenus). Check out the 'products' quick menu on this site and you will know what i mean: http://www.sofaworldhomefurnishings.com

I know how to do a static version of this using CSS and DHTML but in this case the client will need to add/remove sub-menu categories. Consequently the menu will need to be populated from a db. I am using ASP (VBScript) and an MS Access DB.

Does anyone know how to do this or can point to any reference or tutorial?

Any help greatly appreciated.

09-22-2006, 06:24 AM
Hi chillipeppa,

You can construct this with the help of ASP and Ms-Access as you mentioned in your posting that will give you chance of creating an interface for your customer to enter the category and submenu items. They just don't have to touch the ASP code through you developed this item.

If you look at the http://www.sofaworldhomefurnishings.com vertical menu, it acts collapsible but actually they've done nothing about it. If you point your mouse on main category items you can view that it gives you a new page name in your status bar.

Say for example I click on Bedroom Furniture menu now it goes to this page (http://www.sofaworldhomefurnishings.com/category-108-Bedroom_Furniture.aspx) and this page contains ASP code for constructing main menus and the sub category/menu of Bedroom Furniture category.

Below you can fiind the algorithm for doing that. Assuming that you have main categories and sub categories.

1. You are retrieving the main category information from your database and prints it as a vertical say the first category name is Sofa & Chairs then (you are gettiing the page url for this category ) you put that as the main menu there. This is the first looping construct.

2. Then you are checking whether this main category has any sub category(ies) if there is then you are starting another loop and you give some space before printing the submenu just to give a visible impression. Here you put all the sub categories and their corresponding URL as hyperlinks like the main categories. If there is no sub category for a main category then you will exit from the second loop and go to the first one and move towards the second record.

Each of the page will contain this mechanism just for maintaining the left vertical menu

If you want to have some hierarchical left side menu then you can go for some Client-side javascript that works on server side database values.