使用RadControls的RadMenu控件开发系统菜单

大家好，又见面了，我是你们的朋友全栈君。

关于菜单这个话题我想应该是不讲则懂，所以本文不会多讲这些概念，则重关注RadControls控件中的RadMenu控件的使用，结合数据库来开发一个系统菜单。

一、数据库设计

这里我就使用Access作为示例数据库,详细见下图：
使用RadControls的RadMenu控件开发系统菜单

表字段依次为：自动编号、菜单编码、菜单名称、请求地址、菜单上显示的图片地址、快捷键(RadMenu控件支持)、菜单顺序、菜单级限、是否为末级和父菜单编码。整个设计中主要以菜单编码作为关联依据。

二、注册控件及使用控件皮肤

我们可以将控件添加到工具箱直接拖拽到aspx页面上就OK，随后可以在html视图下看到如下注册命令：

<!– Code highlighting produced by Actipro CodeHighlighter (freeware) http://www.CodeHighlighter.com/ –>
1
<%
@RegisterAssembly
=
“
RadMenu.Net2
“
Namespace
=
“
Telerik.WebControls
“
TagPrefix
=
“
rad
“

%>

要使用RadControls提供的皮肤功能很方便，从安装目录下将皮肤文件复制到项目中，然后在控件上直接选择所需要的皮肤就OK。下图为RadMenu选择皮肤截图：

三、编码实现读取数据

示例使用Access数据库，简单配置了几条数据，通过ADO.NET读出来这个很简单，这里就不多说。菜单下的子菜单，以及下一级子菜单，凡是菜单都有可能会有这种情况，这里递归生成就OK。相关代码如下：

<!– Code highlighting produced by Actipro CodeHighlighter (freeware) http://www.CodeHighlighter.com/ –>
1
namespace
MenuDome

2
{

3

public

class
Menu

4
{

5

private

static

string
connectionString
=

“
Provider=Microsoft.jet.OLEDB.4.0;dataSource=
“

6

+
HttpContext.Current.Server.MapPath(
@”
App_Data/MenuDB.mdb
“
);

7

8

private
DataTableExecuteQuery(
string
cmdText)

9
{

10

using
(OleDbConnectionconn
=

new
OleDbConnection(connectionString))

11
{

12

using
(OleDbDataAdapteroda
=

new
OleDbDataAdapter(cmdText,conn))

13
{

14
DataSetds
=

new
DataSet();

15
oda.Fill(ds);

16

return
ds.Tables[
0
];

17
}

18
}

19
}

20

21

public
DataTableGetMenu()

22
{

23

string
sql
=

“
select*frommenuwheregrade=0
“
;

24

return
ExecuteQuery(sql);

25
}

26

27

public
DataTableGetMenuBySupCode(
string
supMenuCode)

28
{

29

string
sql
=

“
select*frommenuwheresupmenucode=’
“

+
supMenuCode
+

“
‘
“
;

30

return
ExecuteQuery(sql);

31
}

32
}

33
}

四、生成菜单项的准备

菜单一般都是公用的（不考虑用户权限相关的控制），我们可以把它开发成为一个公共的部分。本示例使用母版页来做菜单，新建母版页：

在此母版页里加入RadMenu控件，并设置相应的皮肤就OK。如下代码块：

<!– Code highlighting produced by Actipro CodeHighlighter (freeware) http://www.CodeHighlighter.com/ –>
1
<
body
>

2

<
form
id
=”form1″
runat
=”server”
>

3

4

<%
—
菜单开始
—
%>

5

<
rad:RadMenu
ID
=”SystemMenu”
runat
=”server”
Skin
=”Web20″
>

6

</
rad:RadMenu
>

7

<%
—
菜单结束
—
%>

8

9

<%
—
内容开始
—
%>

10

<
asp:ContentPlaceHolder
ID
=”CPH”
runat
=”server”
>

11

12

</
asp:ContentPlaceHolder
>

13

<%
—
内容结束
—
%>

14

15

</
form
>

16
</
body
>

五、根据数据库数据生成菜单项

现在就差最后一步了，根据数据库里读取的数据生成菜单项。由于菜单下会有子菜单情况，示例中将菜单项生成分两步来处理，详细见如下代码：

<!– Code highlighting produced by Actipro CodeHighlighter (freeware) http://www.CodeHighlighter.com/ –>
1

private

void
InitMenu()

2

{

3

//查询出菜单配置信息
4

DataTabledtMenu=menu.GetMenu();
5

for(inti=0;i<dtMenu.Rows.Count;i++)
7

{

8

//Rad菜单项
9

RadMenuItemitem=newRadMenuItem();
10

item.ID=dtMenu.Rows[i][“Code“].ToString();
12

item.Text=dtMenu.Rows[i][“Name“].ToString();
13

item.Value=dtMenu.Rows[i][“Url“].ToString();
14

item.AccessKey=dtMenu.Rows[i][“ShortCut“].ToString();
15

this.SystemMenu.Items.Add(item);
17

//菜建子菜单
19

InitSubMenu(item,dtMenu.Rows[i][“Code“].ToString());
20

}
21

}

除了上面的方法，还有一个构建子菜单的方法InitSubMenu()，如下代码块：

<!– Code highlighting produced by Actipro CodeHighlighter (freeware) http://www.CodeHighlighter.com/ –>
1
private

void
InitSubMenu(RadMenuItemitem,
string
supMenuCode)

2
{

3
DataTabledtMenu
=
menu.GetMenuBySupCode(supMenuCode);

4

5

if
(dtMenu
!=

null
)

6
{

7

foreach
(DataRowdataRow
in
dtMenu.Rows)

8
{

9
RadMenuItemsubItem
=

new
RadMenuItem();

10

11
subItem.ID
=
dataRow[
“
ID
“
].ToString();

12
subItem.Text
=
dataRow[
“
Name
“
].ToString();

13
subItem.Value
=
dataRow[
“
Url
“
].ToString();

14
subItem.AccessKey
=
dataRow[
“
ShortCut
“
].ToString();

15

16
item.Items.Add(subItem);

17

18

if
(Convert.ToInt32(dataRow[
“
EndGrade
“
])
!=

1
)

19
{

20
InitSubMenu(subItem,Convert.ToString(dataRow[
“
Code
“
]));

21
}

22
}

23
}

24
}

六、展现RadMenu风采

通过上面一步步的开发，现在终于可以一览RadMenu的风采了。通过上面建立的母版页建立一内容页，直接运行内容页就可以看到效果了。示例中我使用了三种皮肤：Web2.0,WebBlue和Vista，下面是此三种皮肤的运行截图：