MVC+Nhibernate+jquery+easyui递归实现多级菜单
1.新建访问的控制器动作返回视图,在视图中使用easyui的treegrid插件来得到后台得到的json数据显示多级菜单
public ActionResult Menu()
{
return View();
}
视图:
@{
ViewBag.Title = "Menu";
Layout = "~/Views/Shared/_GridView.cshtml";
}
@section header{}
@section body{
<div id="dataGrid" class="easyui-layout" data-options="fit:true">
<table id="gridView"></table>
</div>
}
@section scripts{
<script src="~/Content/oa/scripts/xlayout.js"></script>
<script type="text/javascript">
$(function () {
alert()
load();
});
function load() {
$('#gridView').treegrid({
url: '/WxMenu/MenuGridView',
title: '微信菜单配置',
treeField: 'Text',
fit: true,
fitColumns: true,
idField: 'Id',
loadMsg: '数据正在加载中......',
sortName: 'Orderby',
sortOrder: 'asc',
pagination: true,
singleSelect: true,
pageSize: ,
pageNumber: ,
pageList: [, , , ],
queryParams: {},
rownumbers: true,
checkOnSelect: true,
selectOnCheck: true,
lines: true,
columns: [[
{ field: 'ck', checkbox: true, width: },
{ field: 'Text', title: '菜单名字', width: , align: 'left' },
{
field: 'MenuId', title: '菜单编码', width: , align: 'left',
formatter: function (value, row, index) {
return value == "-1" ? "" : value;
}
},
{
field: 'IsEnable', title: '有效', width: , align: 'center',
formatter: function (value, row, index) {
return "<span style=\"color:{1};\">{0}</span>".format(
value == "" ? "已启用" : "已禁用",
value == "" ? "green" : "red");
}
},
{ field: 'OrderBy', title: '排序号', width: , align: 'left' },
{
field: 'Target', title: '动作类型', width: , align: 'center',
formatter: function (value, row, index) {
switch (value) {
case 'view':
return "跳转URL";
case 'click':
return "点击推事件";
case 'scancode_push':
return "扫码推事件";
case 'scancode_waitmsg':
return "扫码推事件且弹出(消息接收中)提示框";
case 'pic_sysphoto':
return "弹出系统拍照发图";
case 'pic_photo_or_album':
return "弹出拍照或者相册发图";
case 'pic_weixin':
return "弹出微信相册发图器";
case 'location_select':
return "弹出地理位置选择器";
case 'media_id':
return "下发消息(除文本消息)";
case 'view_limited':
return "跳转图文消息URL";
}
}
},
{ field: 'Ico', title: 'MenuKey', width: , align: 'left' },
{ field: 'Url', title: '菜单URL', width: , align: 'left' }
]],
toolbar: [{
id: 'btnAdd',
text: '添加',
iconCls: 'icon-add',
handler: function () {
showWindow("添加菜单", "/OA/WeiXin/MenuEdit/0", , );
}
}, {
id: 'btnAdd',
text: '编辑',
iconCls: 'icon-edit',
handler: function () {
var row = $('#gridView').datagrid('getSelected');
if (!row) {
showMsg("系统提示", "请选择要编辑的行", true);
return;
}
if (row.Id == "") {
showMsg("系统提示", "此数据不能修改", true);
return;
}
showWindow("添加菜单", "/OA/WeiXin/MenuEdit/" + row.Id, , );
}
},
{
id: 'btnDelete',
text: '删除',
iconCls: 'icon-remove',
handler: function () {
var rows = $('#gridView').datagrid('getChecked');
if (!rows || rows.length == ) {
showMsg("系统提示", "请选择要删除的行", true);
return;
}
showConfirm('系统提示', '删除数据后将无法恢复,还确认删除吗?', function () {
var ids = new Array();
var isRoot = false;
$.each(rows, function (i, n) {
ids.push("'" + n.Id + "'");
isRoot = n.MenuId == "";
if (isRoot) return false;
});
if (isRoot) {
showMsg("系统提示", "菜单(微信公众平台菜单)不能删除!", true);
return;
}
showProcess(true, "系统提示", "正在删除中......");
setTimeout(function () {
$.ajax({
url: "/OA/WeiXin/MenuDelete",
data: { ids: ids.toString(",") },
dataType: "json",
type: "POST",
traditional: true,
success: function (result) {
showProcess(false);
if (result.Success) {
showMsg("系统提示", result.Message, false);
$('#gridView').datagrid('reload');
} else {
showMsg("系统提示", result.Message, true);
}
}
});
}, );
});
}
}, {
id: 'btnRefresh',
text: '更新',
iconCls: 'icon-reload',
handler: function () {
$('#gridView').treegrid('reload');
}
}, {
id: 'btnRefresh',
text: '发布到微信公众平台',
iconCls: 'icon-redo',
handler: function () {
$.ajax({
url: "/WxMenu/MenuToWeiXin",
data: {},
dataType: "json",
type: "POST",
traditional: true,
beforeSend: function () {
showProcess(true, "系统提示", "正发布到微信公众平台......");
},
error: function () {
},
success: function (result) {
showMsg("系统提示", result.Message, false);
},
complete: function () {
showProcess(false);
}
});
}
}],
onLoadSuccess: function () {
var pager = $('#gridView').treegrid('getPager');
pager.pagination({
beforePageText: '第',
afterPageText: '页 共 {pages} 页',
displayMsg: '当前显示 {from} - {to} 条记录 共 {total} 条记录',
buttons: []
});
}
});
}
function radWindowCallBackFn() {
showMsg("系统提示", "存盘成功!", false);
$('#gridView').treegrid('reload');
}
</script>}
2. 后台动作返回一个content()。
public ActionResult MenuGridView(int? page, int? rows, string sort = "", string order = "asc")
{
return Content(GetMenuGridTree());
}
3.通过GetMenuGridTree()函数来返回一个json对象:
public string GetMenuGridTree()
{
NHibernateHelper nhlper = new NHibernateHelper();
ISession session = nhlper.GetSession();
List<TreeModel> result = new List<TreeModel>();
List<TreeModel> children = new List<TreeModel>();
IEnumerable<WeiXinMenu> kinds = session.Query<WeiXinMenu>();
WeiXinMenu root = kinds.FirstOrDefault(c => c.ParentId == "-1");
GetMenuGridTree(kinds, children, "");
result.Add(new TreeModel
{
Id = root.Id.ToString(),
MenuId = root.MenuId,
Text = root.MenuName,
Url = root.MenuUrl,
ParentMenuId = root.ParentId.ToString(),
IsEnable = root.IsEnable,
OrderBy = root.OrderBy.ToString(),
Target = root.MenuType,
Ico = root.MenuKey,
children = children
});
return JsonConvert.SerializeObject(result);
}
其中NHibernateHelper是申明了一个Nhibernate的辅助类,用来建立一个isessionfactory(会话工厂),然后打开一个isession,如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using NHibernate;
using NHibernate.Cfg; namespace Data
{
public class NHibernateHelper
{
private ISessionFactory _sessionFactory;
public NHibernateHelper()
{
//创建ISessionFactory
_sessionFactory = GetSessionFactory();
}
public ISessionFactory GetSessionFactory()
{
//配置ISessionFactory
return (new Configuration()).Configure().BuildSessionFactory();
}
public ISession GetSession()
{
return _sessionFactory.OpenSession();
}
}
}
其中TreeModel类,是创建一个有递归子类的数据库存的菜单表的类。跟我们在Nhibernate中持久化实体的菜单类似,如下:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks; namespace Domain.OrmLib.Model
{
public class TreeModel
{
public string Id { get; set; }
public string MenuId { get; set; }
public string Text { get; set; }
public string Url { get; set; }
public string Ico { get; set; }
public string ParentMenuId { get; set; }
public string IsEnable { get; set; }
public string OrderBy { get; set; }
public string Target { get; set; }
public string IsStretch { get; set; }
public string IsEdit { get; set; }
public string IsDelete { get; set; }
public string Remark { get; set; }
public string state { get; set; }
public string iconCls { get; set; }
public List<TreeModel> children { get; set; }
} }
其中IEnumerable<WeiXinMenu> kinds = session.Query<WeiXinMenu>();这句就是通过Nhibernate的会话isession查询到并枚举我们的实体WeiXinMenu。先把root根部的实体查询出来。
GetMenuGridTree()方法就是递归的调用得到剩下的chilren.
private void GetMenuGridTree(IEnumerable<WeiXinMenu> kinds, List<TreeModel> children, string pId)
{
foreach (WeiXinMenu p in kinds.Where(c => c.ParentId == pId).OrderBy(c => c.OrderBy))
{
TreeModel gt = new TreeModel();
gt.Id = p.Id.ToString();
gt.MenuId = p.MenuId;
gt.Text = p.MenuName;
gt.Url = p.MenuUrl;
gt.ParentMenuId = p.ParentId;
gt.IsEnable = p.IsEnable;
gt.OrderBy = p.OrderBy.ToString();
gt.Target = p.MenuType;
gt.Ico = p.MenuKey; List<TreeModel> childrenTmp = new List<TreeModel>(); GetMenuGridTree(kinds, childrenTmp, p.MenuId); /*
if (childrenTmp.Count > 0)
{
gt.state = "closed";
}
*/ gt.children = childrenTmp; children.Add(gt);
}
}
MVC+Nhibernate+jquery+easyui递归实现多级菜单的更多相关文章
- 年底小回顾(MVC+NHibernate+Jquery+JqueryUI——网站)
1.附:利用MVC+NHibernate+Jquery+JqueryUI这些技术可以做出一个比较好的前台+后台网站.下面是本人对这些技术的笔记,作为私人年底小结吧.呵呵 好久没写文章了,感觉下不了笔吐 ...
- JQuery Easyui/TopJUI 创建多级联动下拉框(纯HTML实现!!!)
JQuery Easyui/TopJUI 创建多级联动下拉框(纯HTML实现!!!) 效果展示: 代码如下: <form data-toggle="topjui-form"& ...
- MVC 使用Jquery EasyUI分页成功
先上图吧
- [转]开源框架完美组合之Spring.NET + NHibernate + ASP.NET MVC + jQuery + easyUI 中英文双语言小型企业网站Demo
热衷于开源框架探索的我发现ASP.NET MVC与jQuery easyUI的组合很给力.由于原先一直受Ext JS框架的licence所苦恼,于是痛下决心寻找一个完全免费的js框架——easyUI. ...
- 开源框架完美组合之Spring.NET + NHibernate + ASP.NET MVC + jQuery + easyUI 中英文双语言小型企业网站Demo(转)
热衷于开源框架探索的我发现ASP.NET MVC与jQuery easyUI的组合很给力.由于原先一直受Ext JS框架的licence所苦恼,于是痛下决心寻找一个完全免费的js框架——easyUI. ...
- 使用 EasyUI 创建左侧导航菜单
使用 JQuery EasyUI 创建左侧导航菜单,菜单的数据由后台服务提供. 效果图 HTML 元素 <div id="menuAccordion"></div ...
- Python作业之多级菜单
作业之多级菜单 菜单实现要求: 1. 列出菜单选择供选择 2. 选择对应内容进入下一级菜单 3. 任何时候都可以选择退出程序或返回上一级菜单 具体代码如下: goods = {'华为':{'A系':{ ...
- 记一次艰难的jquery easy-ui ajax post 体验
分享的经验和教训是: 1.jquery easy-ui ajax post 复杂的Json给后端解析,后端如果接收和解析 2.asp.net webform jquery easy-ui datagr ...
- jquery easyui菜单树显示
目前做了一个easyui项目需要显示多级菜单,菜单配置到数据库中,因此每级菜单都需要到数据库中取,用了jQuery EasyUI方便多了. 效果体验:http://hovertree.com/texi ...
随机推荐
- SQL查询 若为空显示默认值
COALESCE(a.end_,now()) SELECT COALESCE(NULL,NULL,3,4,5) FROM
- CRM 客户关系管理系统
CRM(Customer Relationship Manager)客户关系管理系统 企业为提高核心竞争力,利用相应的信息技术以及互联网技术协调企业与顾客间在销售.营销和服务上的交互,从而提升其管理方 ...
- 聊聊 CDN 缓存与浏览器缓存
CDN 是互联网上内容分发的重要一环.无论您之前是否了解过 CDN,其实它已经在您的日常生活中发挥作用了.比如您正在淘宝挑选心仪的商品,或者在观看一段令人捧腹的视频,以及您正在阅读的这篇文章,这些资源 ...
- 通过jdbc连接MySql数据库的增删改查操作
一.获取数据库连接 要对MySql数据库内的数据进行增删改查等操作,首先要获取数据库连接 JDBC:Java中连接数据库方式 具体操作如下: 获取数据库连接的步骤: 1.先定义好四个参数 String ...
- 树的直径 【bzoj3363】[Usaco2004 Feb]Cow Marathon 奶牛马拉松
3363: [Usaco2004 Feb]Cow Marathon 奶牛马拉松 Description 最近美国过度肥胖非常普遍,农夫约翰为了让他的奶牛多做运动,举办了奶牛马拉松.马拉 松路线要尽 ...
- 3、kubernetes应用快速入门190625
一.kubernetes应用入门 1.kubectl命令 Basic Commands create Create a resource from a file or from stdin. expo ...
- CF446A DZY Loves Sequences 简单dp
DZY has a sequence a, consisting of n integers. We'll call a sequence ai, ai + 1, ..., aj (1 ≤ i ≤ j ...
- CF987C Three displays 解题报告
题目传送门 题目大意 n个位置,每个位置有两个属性s,c,要求选择3个位置i,j,k,使得s_i<s_j<s_k,并使得c_i+c_j+c_k最小 方法1 n³枚举每一种情况(也许可以拿 ...
- vs获取最新时,提示签出解决方案
项目中的文件有被意外去掉了只读属性的. VSS中签入状态的文件在本地都有只读属性. 如果VSS中是签入状态,而对应的本机文件没有只读状态,在获取最新版本的时候,就会弹出一个对话框提示签出还是用VSS中 ...
- springMvc配置 中文api
http://7xvpsh.com1.z0.glb.clouddn.com/publish/21-2/the-dispatcher-servlet.html springmvc4.1.7:配置 复制转 ...