Introduction: In this
article I am going to explain how to create a dynamic menu in asp.net
Description:
Create a table (“Main_menu”).
Id
|
int
|
Menu_Name
|
varchar(50)
|
Menu_Url
|
varchar(100)
|
Menu_Order
|
int
|
Store
Procedure:
To Insert data:
Create PROCEDURE Insert_Menu
(
@menuname varchar(50),
@menuurl varchar(100),
@menuorder int
)
AS
BEGIN
SET
NOCOUNT ON;
Insert into dbo.Main_menu
values(@menuname,@menuurl,@menuorder)
END
GO
Store
procedure to get data:
Create PROCEDURE [dbo].[Get_Menu]
AS
BEGIN
SET
NOCOUNT ON;
Select * from dbo.Main_menu order by Menu_Order
END
HTML
Markup of Create Menu page:
<fieldset style="height:auto;width:auto">
<legend>Add Menu</legend>
<table>
<tr><td></td><td></td></tr>
<tr><td>Menu Name:</td><td>
<asp:TextBox ID="txtmenuname" runat="server"></asp:TextBox></td></tr>
<tr><td></td><td></td></tr>
<tr><td>Menu url:</td><td>
<asp:TextBox ID="txtmenuurl" runat="server"></asp:TextBox></td></tr>
<tr><td></td><td></td></tr>
<tr><td>Menu Order:</td><td>
<asp:DropDownList ID="ddlmenuorder"
runat="server">
<asp:ListItem>--Select--</asp:ListItem>
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
</asp:DropDownList>
</td></tr>
<tr><td></td><td></td></tr>
<tr><td></td><td>
<asp:Button ID="Button1" runat="server" Text="Add Menu" onclick="Button1_Click" />
</td></tr>
</table>
</fieldset>
On button click write the below given code (C#):
using
System.Data;
using
System.Data.SqlClient;
using
System.Configuration;
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["con"].ToString());
protected void
Button1_Click(object sender, EventArgs e)
{
SqlCommand cmd = new SqlCommand("Insert_Menu", con);
cmd.CommandType = CommandType.StoredProcedure;
con.Open();
cmd.Parameters.AddWithValue("@menuname",
txtmenuname.Text);
cmd.Parameters.AddWithValue("@menuurl",
txtmenuurl.Text);
cmd.Parameters.AddWithValue("@menuorder",
ddlmenuorder.SelectedValue);
cmd.ExecuteNonQuery();
con.Close();
cmd.Dispose();
Clearcontrol();
}
public void
Clearcontrol()
{
txtmenuname.Text = "";
txtmenuurl.Text = "";
ddlmenuorder.SelectedValue = "--Select--";
}
VB:
Imports
System.Data
Imports
System.Data.SqlClient
Imports
System.Configuration
Private con As New SqlConnection(ConfigurationManager.ConnectionStrings("con").ToString())
Protected Sub
Button1_Click(ByVal sender As Object, ByVal e As EventArgs)
Dim cmd As
New SqlCommand("Insert_Menu", con)
cmd.CommandType = CommandType.StoredProcedure
con.Open()
cmd.Parameters.AddWithValue("@menuname",
txtmenuname.Text)
cmd.Parameters.AddWithValue("@menuurl",
txtmenuurl.Text)
cmd.Parameters.AddWithValue("@menuorder",
ddlmenuorder.SelectedValue)
cmd.ExecuteNonQuery()
con.Close()
cmd.Dispose()
Clearcontrol()
End Sub
Public Sub
Clearcontrol()
txtmenuname.Text = ""
txtmenuurl.Text = ""
ddlmenuorder.SelectedValue = "--Select--"
End Sub
Add a new page to show the menu. HTML Markup of the page:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<style type="text/css">
a {text-decoration:
none;}
#MainMenu a:link,
#MainMenu a:visited
{color:White; font-weight:bold;margin-right: 10px;}
#MainMenu a:hover
{color:yellowgreen;
font-weight:bold;}
</style>
</head>
<body>
<form
id="form1"
runat="server">
<div>
<div
id="MainMenu"
style="height: 35px; width:100%; background-color:Black ; margin-top:-2px">
<table
width="100%"
style="height: auto" ><tr><td width="20%"><p ></p></td>
<td>
<asp:DataList ID="dlMenu" runat="server"
DataKeyField="id"
RepeatDirection="Horizontal" ShowFooter="False" ShowHeader="False"
CellPadding="5"
CellSpacing="2">
<ItemTemplate>
<asp:HyperLink ID="HyperLink1"
runat="server"
NavigateUrl='<%# Eval("Menu_Url") %>' Text='<%# Eval("Menu_Name") %>' />
</ItemTemplate>
</asp:DataList>
</td>
</tr></table>
</div>
</div>
</form>
</body>
</html>
Write below given code on (.aspx.cs) file of menu page (C#):
using
System.Data;
using
System.Data.SqlClient;
using
System.Configuration;
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["con"].ToString());
protected void
Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
Bindmenu();
}
}
public void
Bindmenu()
{
SqlDataAdapter adp = new SqlDataAdapter("Get_Menu", con);
adp.SelectCommand.CommandType = CommandType.StoredProcedure;
DataTable dt = new DataTable();
adp.Fill(dt);
if (dt.Rows.Count > 0)
{
dlMenu.DataSource = dt;
dlMenu.DataBind();
}
}
VB:
Imports
System.Data
Imports
System.Data.SqlClient
Imports
System.Configuration
Private con As
New SqlConnection(ConfigurationManager.ConnectionStrings("con").ToString())
Public Sub
Bindmenu()
Dim adp As
New SqlDataAdapter("Get_Menu", con)
adp.SelectCommand.CommandType = CommandType.StoredProcedure
Dim dt As
New DataTable()
adp.Fill(dt)
If dt.Rows.Count > 0 Then
dlMenu.DataSource = dt
dlMenu.DataBind()
End If
End Sub
Protected Sub
Page_Load(ByVal sender As
Object, ByVal e
As System.EventArgs)
Handles Me.Load
If Not
IsPostBack Then
Bindmenu()
End If
End Sub
End Class
Output:
If yes post your comment to appreciate my work and fell free to contact me. You can like me on Facebook, Google+, Linkedin and Twitter via hit on Follow us Button and also can get update follow by Email.
No comments:
Post a Comment