Dynamic Menu Control in ASP.NET

No.of Views1742
Bookmarked0 times
Downloads 
Votes0
By  NikhilJohari   On  16 Feb 2010 03:02:18
Tag : ASP.NET , Menus
Dynamic Menu Control in ASP.NET
emailbookmarkadd commentsprint

Images in this article missing? We recently lost them in a site migration. We're working to restore these as you read this. Should you need an image in an emergency, please contact us at info@codegain.com

 

Introduction

In this article i will show you step by step procedure how to use.Dynamic Menu Control in ASP.NET in visual studio 2005 / 2008.Dynamic Menu control is very useful in asp.net these are menu which you can see on every site, by menu control you can navigate from one page to another page.

 

Here I am using Visual Studio 2008 but there is no condition you can use Visual Studio 2005 also.So follow these steps to create Dynamic Menu Control.

The Steps are


1- Start -> All Programs -> Visual Studio 2005 or Visual Studio 2008 


2- Now go to File Menu -> New -> Web Site


3- Under Visual Studio Installed Template-> Choose ASP.NET WEB SITE -> Choose File System from the location combo box -> Set the path by the browse button - > Choose the language from the Language ComboBox (Visual C# , Visual Basic , J #)
Choose Visual C#


4 - Click on the OK Button:-
First you have to learn XML and HTML to work with ASP .NET_ 

I have used to make the text as comment this is the way to make comment in this code

 

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN" “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Type your webpage title here</title>  <!– Here you can specify your page title in between title tag ->
</head>
<body>
<form id="form1? runat="server">
<div>
<!– In between div tags you can manage your web controls like buttons, labels, picture
Box, ImageMap etc –>

</div>
</form>
</body>
</html>

 

See here is a tab named Design in the bottom of this page
5- Click on this tab and you will see a blank web page where you can drag any control from the toolbox (which is in the left side of this window)
Open Web.config file and write true in place of false, See

<compilation debug="true">

 

6- Drag a Menu Control from the navigation control tab
7-Now go in solution explorer and right click on the website and choose Add new item, select XML file
now again choose Add new item, select site Map
8- Now open XML file and type this code in this

<?xml version="1.0" encoding="utf-8" ?>
<application>
 
  <setction title="Section 1" value="default.aspx">
    <subpage title ="Page 1" value="page1.aspx"/>
    <subpage title ="Page 2" value="page2.aspx"/>
    <subpage title ="Page 3" value="page3.aspx"/>
  </setction>
 
  <setction title="Section 2" value="default.aspx">
    <subpage title ="Page 1" value="page1.aspx"/>
    <subpage title ="Page 2" value="page2.aspx"/>
    <subpage title ="Page 3" value="page3.aspx"/>
  </setction>
 
</application>

 

9- Now open your site Map file and type this code in it

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
 
  <siteMapNode url= "Default.aspx" title= "Section 1"  description="">
    <siteMapNode url="Page1.aspx" title="Page 1"  description="" />
    <siteMapNode url="Page2.aspx" title="Page 2"  description="" />
    <siteMapNode url="Page3.aspx" title="Page 3"  description="" />
  </siteMapNode>
</siteMap>

 

10- In Design mode select menu control and click on the arrow (seems when you move cursor on menu control)
Choose Data Source -> choose XML or Site Map Data Source,Ok
11 - Now run your web site by Ctrl + F5

 

Output

12-Menu Bar would seem like this

 

Image Loading

 

 

13- Close web browser.


14-Close visual studio

 
Sign Up to vote for this article
 
About Author
 
NikhilJohari
Occupation-
Company-
Member Type-Senior
Location-India
Joined date-15 Aug 2009
Home Page-http://fast-get.com
Blog Page-http://dotnetask.blog.co.in
 
 
Other popularSectionarticles
Comments
There is no comments for this articles.
Leave a Reply
Title:
Display Name:
Email:
(not display in page for the security purphase)
Website:
Message:
Please refresh your screen using Ctrl+F5
If you can't read this number refresh your screen
Please input the anti-spam code that you can read in the image.
^ Scroll to Top