Click here to Skip to main content
Click here to Skip to main content

ASP.NET Dynamic XML Web Menu Control based on JavaScript

, 22 Sep 2005
Rate this:
Please Sign up or sign in to vote.
ASP.NET dynamic XML web menu control based on JavaScript.


This is a free web based menu (JavaScript enabled) control. There are not many web menu controls available that support dynamic menu creation and binding. This WebMenu control supports dynamic menu creation, XML menu binding and also DataSet binding. This control uses triga (free script) JavaScript menu internally. Any complex menu structure can be represented using a simple XML schema. Menu position and style can be easily applied and changed dynamically without affecting the web application.

Steps to setup WebMenu

  1. Create a new ASP.NET web project, right click on ToolBox; choose 'Add/Remove items' and add the SuperControls.WebMenu.dll reference (compile SuperControls.WebMenu.cproj to get the DLL).
  2. Copy the JS files menu_tpl.js and menu.js to the root directory of the site.
  3. Copy menu stylesheet menu.css file to the subdirectory css.
  4. Copy menudata.xml to the root directory.
  5. Create an ASPX file and drag and drop the WebMenu control to the WebForm and use one of the methods (given below) to bind the XML/dynamic data to the menu control.


<cc1:WebMenu id="WebMenu1" MenuXMLPath="\\ServerName\rad\menudata.xml" 
                                        PadWidth="24" runat="server">
Other samples
<cc1:WebMenu id="WebMenu2" MenuXMLPath="ServerName\rad\menudata.xml" 
                      ImageArrow="<img src=images\\arrow.gif border=0" 
                      PadWidth="22" runat="server">
<cc1:WebMenu id="WebMenu3" MenuXMLPath="\\ServerName\rad\menudata.xml" 
                           ImageArrow="" PadWidth="26" runat="server">

Ways of binding menu items dynamically...

Method 1

Set MenuXMLPath property with the path of the XML menu file in the server.

Method 2

Create new DataSet with the XML file and bind to the web menu control.

For example:

       DataSet dsMenu = new DataSet();
       WebMenu1.DataSource = dsMenu;

Method 3

Get the menu data from database and populate the DataSet with the following structure:

  • Column 1 : menuid (unique ID of menu item).
  • Column 2 : name (name of the menu item).
  • Column 3 : root (parent of the menu item. If it is the starting/root item then the root value will be "" else it will be the value of the parent menuid).
  • Column 4 : url (URL for the menu item).

For example:

 WebMenu1.DataSource = dsMenu;
 // (Sample DataSet is given below.)

XML menu file (sample)

<?xml version="1.0" encoding="utf-8" ?> 
    'Level 0 nodes
    <menuitem root="" name="Search Sites" menuid="1" />
    <menuitem root="" name="Webmail Sites"  menuid="2" />
    <menuitem root="" name="DotNet Sites"  menuid="3" />
    'Level 1 Items
    <menuitem root="1" name="Google" url="" 
    <menuitem root="1" name="Altavista" url="" 
    'Level 1 Items
    <menuitem root="2" name="Hot-mail" url=""  menuid="21"/>
        'Level 2 Items
        <menuitem root="21" name="Hotmail" url="" 
        <menuitem root="21" name="MSN" url="" 
    <menuitem root="2" name="Yahoo" url="" 
    <menuitem root="2" name="Rediff" url="" 
    'Level 1 Items
    <menuitem root="3" name="Microsoft" url="" 
    <menuitem root="3" name="GotDotNet" url="" 
    <menuitem root="3" name="CodeProject" url="" 
    <menuitem root="3" name="ASpdotnet" url="" 

In the above sample, the root attribute represents the parent of the menu item. The root attribute will be empty for parent/level zero menu items.

Sample dynamic menu DataSet (with one DataTable)

root name menuid url
Search Sites 1
Webmail Sites 2
DotNet Sites 3
1 Google 11
1 Altavista 12
2 Hot-mail 21
21 Hotmail 211
21 MSN 212
2 Yahoo 22
2 Rediff 23
3 Microsoft 31
3 GotDotNet 32
3 CodeProject 33
3 ASpdotnet 34


This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


About the Author


United Arab Emirates United Arab Emirates
Software Engineer from India,Working in .NET for 2 years.

Comments and Discussions

GeneralMy vote of 5 Pinmemberroyal_king4-Apr-13 22:30 
Questionmain root url Pinmemberegyptmaaaaan29-Jan-12 0:27 
GeneralMy vote of 3 Pinmemberbhargavpp16-Aug-11 0:28 
GeneralMenu is undefined PinmemberDeepak BOB12-Jul-10 20:39 
GeneralMasterPage Error Pinmemberwallaces52829-Nov-09 17:53 
GeneralI cant see the menu PinmemberKoval_Prad6-Oct-09 5:18 
Generalcant see anything Pinmembernandakumarse2-Jul-09 0:40 
Generalmenus position [modified] Pinmembersooberfellow30-Jun-09 22:15 
GeneralOracle connectivity Pinmemberkvalli15-Apr-09 23:32 
QuestionHow can i set the target frame.. Pinmemberryanjoseph8-Feb-09 15:53 
GeneralMicrosoft JScript runtime error: 'menu' is undefined PinmemberMember 161041523-Nov-08 21:14 
Generalset menu as vertical and horiz Pinmemberramakrishna_yl18-Nov-07 22:25 
GeneralThank u a lot Pinmemberramakrishna_yl24-Oct-07 1:50 
AnswerRe: Thank u a lot PinmemberDeepak BOB12-Jul-10 20:37 
GeneralSystem.StackOverflowException Pinmemberramakrishna_yl24-Oct-07 0:50 
QuestionCan not see anything Pinmemberalexaz112-Oct-07 10:28 
Generalkewl Pinmemberchullan20-Jun-07 21:49 
GeneralPlease Inform me PinmemberPrapthi26-Mar-07 0:17 
GeneralGiving ERROR menu is undefined Pinmemberswapnali.mankar16-Mar-07 1:45 
GeneralRe: Giving ERROR menu is undefined PinmemberAndré FliP19-Apr-07 10:28 
GeneralRe: Giving ERROR menu is undefined Pinmembersolrac005-Feb-10 6:24 
GeneralTigra Menu Pinmembertreputt2-Mar-07 7:16 
Questionneed object in menu.js 78 [modified] Pinmemberhihba6-Feb-07 16:42 
Joketanx PinmemberJuan Carlos Guillén Zurita2-Feb-07 6:43 
GeneralI don't see anything either. PinmemberGrondal17-Nov-06 2:03 
GeneralDont see anything... Pinmemberkeng15099-Nov-06 18:05 
GeneralVertical Menu Pinmembercsgraham17-Oct-06 10:23 
Generaljust want to said thank you Pinmembertarikelmallah16-Oct-06 10:45 
QuestionUsing different images for each menu? Pinmembersaeed_amd20-Sep-06 23:34 
QuestionHow to position the menu inside a table cell Pinmemberreza55311-Sep-06 5:36 
AnswerRe: How to position the menu inside a table cell PinmemberKountree9-Oct-06 11:00 
AnswerCan not see any menu when we diployee our application in IIS 7 server ......... Pinmembervikas197611-Dec-09 0:12 
AnswerCan not see any menu when we diployee our application in IIS 7 server . pls help Pinmembervikas197611-Dec-09 0:13 
QuestionHow to have the menu items overlap the other frame PinmemberKUNAL9931-Aug-06 10:05 
QuestionHow to change the image in menu control PinmemberKUNAL9931-Aug-06 9:29 
AnswerRe: How to change the image in menu control PinmemberKUNAL9931-Aug-06 9:57 
Questioni wanna insert/edit/delete datas in the xml file,but...... Pinmemberdaybug25-Aug-06 18:37 
Generaloverlapping menu with listbox/dropdowns Pinmemberlil_evil2-Jul-06 19:37 
GeneralRe: overlapping menu with listbox/dropdowns Pinmemberpsamy2-Jul-06 20:17 
GeneralRe: overlapping menu with listbox/dropdowns Pinmemberlil_evil3-Jul-06 11:21 
GeneralRe: overlapping menu with listbox/dropdowns PinmemberParas Shah14-Nov-06 3:17 
GeneralRe: overlapping menu with listbox/dropdowns PinmemberSpeed_up29-Nov-07 6:08 
QuestionCan crossover frame page? PinmemberQ_Quek3-Apr-06 0:58 
GeneralUseless control PinmemberRakeshSaini1234530-Mar-06 1:37 
GeneralRe: Useless control PinmemberKountree9-Oct-06 11:00 
GeneralUnable to see PinmemberRakeshSaini1234530-Mar-06 1:33 
Generali am unable to see menu PinmemberRakeshSaini1234530-Mar-06 0:51 
Questionvertical menu PinmemberShennawy2-Dec-05 8:14 
QuestionRight to Left menus PinmemberShennawy2-Dec-05 8:12 
AnswerRe: Right to Left menus PinmemberM.ARAFA3-Jan-06 22:59 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.150414.1 | Last Updated 22 Sep 2005
Article Copyright 2005 by Krishna_accent
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid