受欢迎的博客标签

用C#从数据库动态生成AdminLTE菜单的一种方法

Published
优化关键点: 1、导航的生成,从来都不应该在后端拼接好html传给前端展示,建议博主还是好好去看看那些稍微好一点的框架是怎么实现的吧。 2、后端只生成树结构,结构中可以标记当前页等,可以根据权限配置这个树。html有关的都在razor视图中遍历树,拼接,再做一些交互事件。这样其他项目也能复用这个树组件,换了模版 改razor就好了。 当前的应用设计风格趋于Flat扁平化,很多基于BootStrap实现了很多UI非常漂亮的管理界面(Bootstrap admin template)。 此核心文件开源在Github:https://github.com/JackWangCUMT/AdminLTE-Menu-Generate。首先看一下主界面: 查看左边导航的菜单html结构(下面代码有错误,HTML自定义属性直接用空格进行分割,而不是,号进行分割,不然jquery获取定义属性时可能会出现错误): 通过观察,可以发现其中菜单树的特点,这里注意一下,菜单顶级的标题显示在span中,另外class也不同。那边如何从数据库动态生成符合此特征的treemenu结构呢? 1 数据库字段设计 2 演示数据 5 菜单类实现: 首先树结构的菜单,自然想到用递归来构建(去掉html自定义属性的分割,号,用空格代替),代码如下:  View Code 6 调用 7 测试 验证生成的菜单结构是否正确,首先看看显示的层级结构和数据库是否一致,另外查看单击上级,是否可以展开,最后注意的是,在左边菜单收缩后,只显示图标,鼠标移动到图标上后,并能正确显示子菜单: 8 应用 假设菜单是这样的: 用jquery可以在单击菜单某项时,打开页面 核心文件开源在Github:https://github.com/JackWangCUMT/AdminLTE-Menu-Generate。 水平有限,望各位园友不吝赐教!如果觉得不错,请点击推荐和关注! 出处:http://www.cnblogs.com/isaboy/ 声明:本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。  .