65.9K
CodeProject 正在变化。 阅读更多。
Home

构建和显示无限制的动态菜单(英语和阿拉伯语)

starIcon
emptyStarIcon
starIcon
emptyStarIconemptyStarIconemptyStarIcon

1.80/5 (6投票s)

2005年9月25日

viewsIcon

33408

downloadIcon

922

本文提供了一个管理模块,用于在数据库中构建无限制的菜单,并提供代码来显示此菜单。

引言

此代码是一个.net项目,安装后将为您提供3个网页,第一个页面允许您构建
使用类似Microsoft Windows的树形视图来构建您的菜单,您可以创建无限子菜单,第二个页面以
从左到右的方式显示菜单,用于英文网站,第三个页面以从右到左的方式显示菜单,用于阿拉伯语网站。
现在,网站开发人员无需担心您的菜单,他们只需要使用第一个页面在线构建菜单
,并在他们的网站中使用其他页面之一的源代码来从数据库中显示菜单。他们现在可以创建和显示
无限菜单。
此模块包含Bluegrass Technologies的 JavaScript 和 CSS 代码版权。

使用代码

your machine should has:

1- .net framework v 1.1
2- Sql server 2000
3- IIS 5.0

steps

1- run the file webcontrol/iewebcon.msi
2- run file setup.exe (websetup1/debug/setup.exe)
3- run the script fil dbscript.sql inyour sql server to create table menu
4- make authontication in yuor sql server mixed
5-change connection string to your sql in the file data/sqlconnection.txt
6-it will create application in your IIS called dynamicmenu
you will find 3 pages
    1- english.aspx to display left to right menu
    2- arabic.aspx to display right to left menu
    3- menuadmin.aspx to construct your menu

note: the table menu contains some items, you can remove them .

how to construct menu
1- goto http://localhost/dynamicmenu.aspx
2- you will find a tree with a node called menu selected
3- write name & url of menu item and press add , the item will be created and selected 
4- select the node where you want to add menu and repeate 3


how to delete menu item
you not allowed to delete item from database , but alternatively you can make it hidden or visible 
by selecting it and press the aprpriate button

note : the menu item will be hidden from the english or arabic display not from menuadmin tree

How to change display settings
in the file res/css/english.css or arabic.css you can change 
the width of menu,the image of arrow, and the color settings


//////Arabic.aspx///////////////////
ul
{
    width: 230px; ////////width of the menu
    border: solid 1px #cccc99;
    border-top: solid 5px #cccc99;
    border-left: solid 2px #cccc99;
    padding: 0px;
}

li ul
{
    display: none;
    position: absolute;
    margin-right: 260px; //// should be 2*width-5
    margin-top: -30px;
}
////////////////////english.aspx///////////////
ul
{
    width: 230px; //////width of the menu
    border: solid 1px #cccc99;
    border-top: solid 5px #cccc99;
    border-right: solid 2px #cccc99;
    padding: 0px;
}

li ul
{
    display: none;
    position: absolute;
    margin-left: 225px;///////should be width-5
    margin-top: -25px;
}
///////////////////////////////////////////////
in the display page you will find stylesheet to change font, color,and hover of the menu

关注点

我认为我增加的价值是使用递归函数从数据库中显示菜单的无限子项,并提供树形视图来构建菜单。
© . All rights reserved.