在mvc中动态加载菜单
来源:互联网 发布:淘宝怎么快速上传宝贝 编辑:程序博客网 时间:2024/04/28 03:06
最近做了一个项目, 要在客户端动态的显示菜单,也就是这些菜单是保存在数据库中的, 在客户端动态加载菜单,这样做的好处很明显,就是菜单很容易修改,直接在后台进行维护,再也不会直接在前面的 视图页面中进行修改,但是,缺点也很明显,实现起来有一定的难度,如果菜单多的话,在前台首次加载时,页面就会变慢,我想谈谈自己在这方面的经验
首先, 我们要创建两个表,(其实一个表也可以了,不过那样的话会变得比较复杂), 一个一级分类表, 一个二级分类表, 两个表的结构如下 :
一个是一级分类表,对应的就是父级菜单, 一个是二级分类表,对应的就是子菜单
实现步骤如下: 定义一个方法, 读取所有的一级分类的菜单, (注意在一级分类中的菜单编码 (channelNo)是唯一的) , 然后定义一个 查询出指定一级编号下的所有的二级菜的 返回 类型都是集合类型
这样编写好相关的数据访问层后,在控制器中直接调用就可以了,关键步骤是在视图中,在控制器中要定义两个 关键的Action, 一个获取一级分类, 一个获取一级分类下的二级分类名称,我的控制器中的 Action是这样写的:
1 /// <summary> 2 /// 获取一级分类名称 帮助导航列表 3 /// </summary> 4 /// <returns></returns> 5 public ActionResult GetAll() 6 { 7 //一级分类名称 8 var model = channelService.GetAll(); 9 return PartialView("/views/shared/_help.cshtml", model);10 }11 12 13 /// <summary>14 /// 一级分类下的二级分类名称 帮助导航列表15 /// </summary>16 /// <param name="chid"></param>17 /// <returns></returns>18 public ActionResult GetMenu(int chid)19 {20 ///一级分类下的二级分类名称 21 var model = partService.GetAll(chid);22 return PartialView("/views/shared/_menu.cshtml", model);23 24 }
返回的都是一个部分视图, 在这两个部分视图中,是这样布局的
1 @{ 2 Layout = null; 3 } 4 @model IEnumerable<xftwl.Common.ChannelModel> 5 6 7 <div id="accordion1" class="accordion"> 8 <div class="accordion-top"><h3>帮助中心</h3></div> 9 10 @if (Model != null)11 {12 13 foreach (var item in Model)14 {15 if (item.Id > 0)16 {17 <div class="accordion-group">18 <div class="accordion-heading"> 19 <a class="accordion-toggle" href="#" data-target="#@item.Id" data-toggle="collapse"> @item.ChannelName20 </a>21 </div>22 <div id="@item.Id" class="accordion-body collapse">23 @Html.Action("GetMenu", "Help", new { chid = item.Id })24 </div>25 26 </div>27 28 }29 }30 }31 32 </div>33 34
在 _menu.cshtml 部分视图中, 视图是这样布局的
1 @{ 2 Layout = null; 3 } 4 @model IEnumerable<xftwl.Common.PartModel> 5 6 @if( Model !=null) 7 { 8 foreach (var t in Model) 9 {10 <div class="accordion-inner clearfix">11 <label class="field"><a href="@Url.Action("Index", "help", new {prtid=t.Id })" target="test"><strong>@t.PartName</strong></a></label>12 </div> 13 }14 }
最后,在控制器 的 Index 视图中这样来写 :
1 ViewBag.Title = "帮助中心"; 2 Layout = "~/Views/Shared/_Layout.cshtml"; 3 } 4 @model IEnumerable<xftwl.Common.ArticleModel> 5 6 <!--main--> 7 <div class="container content-main-help"> 8 @* @Html.Partial("_HelpMeau")*@ 9 10 @Html.Action("getall","help")11 <div class="help-text-right">12 13 @if (Model != null)14 {15 16 foreach (var item in Model)17 { 18 19 <div style="height:auto">20 21 <a href="@Url.Action("Detail","Help", new{Id=item.Id})" > @item.Title</a>22 </div>23 24 }25 }26 27 </div>28 </div>29 30 <!--main end-->
其中的循环遍历是获取一级分类的名称的,好,运行一下看看效果怎么样
这是所有的一级菜单展开后的样子。好了,今天就到这吧。
0 0
- 在mvc中动态加载菜单
- 在MVC应用程序中动态加载PartialView
- 在 MVC 中动态绑定下拉菜单的方法
- MVC中动态绑定下拉菜单
- C# WFP中动态菜单的加载
- 动态加载菜单
- 在VC中动态改变菜单
- 在VB中动态添加弹出菜单
- 在程序中动态改变菜单
- 在VC中动态改变菜单
- 谈在VC中动态改变菜单
- 如何在VC中实现动态菜单
- 在VC中动态改变菜单
- 在Windows Mobile中动态修改菜单
- ext mvc 动态加载
- WinForm 从XML中动态加载菜单的示例
- WinForm 从XML中动态加载菜单的示例
- 前端框架 zTree 从数据库中动态加载树形菜单
- 读书笔记-JSP自定义标签
- Effective C# :创建二进制组件
- 黑马程序员---文件和流操作
- iOS中使用自定义ttf/ttc字体,以及cocosbuilder中指定字体的方法
- 循环链表解决约瑟夫环问题
- 在mvc中动态加载菜单
- 子页面调用父页面方法---js方式
- javascript如何实现类
- Heritrix 拓展Heritrix
- HDU4772 2013 Asia Hangzhou Regional Contest C Zhuge Liang's Password
- strace,ltrace linux下跟踪进程调用的命令
- JAVA_WEB项目之使用Spring的xml配置方式在项目中管理Lucene检索框架
- iOS 隐藏键盘各种方法
- 牛顿跌代法