MVC4中EasyUI Tree异步加载JSON数据生成树
1,首先构造tree接受的格式化数据结构MODEL
/// <summary>
/// 定义EasyUI树的相关数据,方便控制器生成Json数据进行传递
/// </summary>
// [DataContract]
[Serializable]
public class EasyTreeData
{
/// <summary>
/// ID
/// </summary>
// [DataMember]
public string id { get; set; }
/// <summary>
/// 节点名称
/// </summary>
// [DataMember]
public string text { get; set; }
/// <summary>
/// 是否展开
/// </summary>
//[DataMember]
public string state { get; set; }
/// <summary>
/// 图标样式
/// </summary>
// [DataMember]
public string iconCls { get; set; }
/// <summary>
/// 子节点集合
/// </summary>
// [DataMember]
public List<EasyTreeData> children { get; set; }
/// <summary>
/// 默认构造函数
/// </summary>
public EasyTreeData()
{
this.children = new List<EasyTreeData>();
this.state = "open";
}
/// <summary>
/// 常用构造函数
/// </summary>
public EasyTreeData(string id, string text, string iconCls = "", string state = "open")
: this()
{
this.id = id;
this.text = text;
this.state = state;
this.iconCls = iconCls;
}
/// <summary>
/// 常用构造函数
/// </summary>
public EasyTreeData(int id, string text, string iconCls = "", string state = "open", List<EasyTreeData> children=null )
: this()
{
this.id = id.ToString();
this.text = text;
this.state = state;
this.iconCls = iconCls;
this.children = children;
}
}
2,前台代码
2.1,前台代码html代码
<ul id="tt"></ul>
2.2,前台代码脚本
<script type="text/javascript">
$(function () {
$('#tt').tree({
checkbox: false,
url: '/Cultivate/GetUserTreeJson',
onClick: function (node) {
alert(node.id);
}
});
});
</script>
3,控制器(Cultivate)的方法GetUserTreeJson'
3.1,控制器(Cultivate)的方法GetUserTreeJson代码
[HttpPost]
public ActionResult GetUserTreeJson()
{
int PID = -1;
List<EasyTreeData> treeList = new List<EasyTreeData>();
if (PID == -1)
{
var list = (from p in db.cultivates
where p.NodePID == PID
orderby p.NodeID
select p).ToList();
foreach (cultivate info in list)
{ var child = (from p in db.cultivates
where p.NodePID == info.NodeID
orderby p.NodeID
select p).ToList();
if (child.Count ==0)
{
treeList.Add(new EasyTreeData(info.NodeID, info.NodeName, "icon-user"));
}
else
{
treeList.Add(new EasyTreeData(info.NodeID, info.NodeName, "icon-user","open", GetUserTreeJson2(info.NodeID)));
}
}
}
string json = ToJson(treeList);
return Content(json);
}
3.2,如果有N级菜单循环代码
private List<EasyTreeData> GetUserTreeJson2( int PID)
{
List<EasyTreeData> treeList = new List<EasyTreeData>();
var list = (from p in db.cultivates
where p.NodePID == PID
orderby p.NodeID
select p).ToList();
foreach (cultivate info in list)
{
var child = (from p in db.cultivates
where p.NodePID == info.NodeID
orderby p.NodeID
select p).ToList(); ;
if (child.Count == 0)
{
treeList.Add(new EasyTreeData(info.NodeID, info.NodeName, "icon-user"));
}
else
{
treeList.Add(new EasyTreeData(info.NodeID, info.NodeName, "icon-user", "closed", GetUserTreeJson2(info.NodeID)));
}
}
return treeList;
}
3.3,Json代码生成。
protected string ToJson(object obj)
{
string jsonData = (new JavaScriptSerializer()).Serialize(obj);
return jsonData;
}
MVC4中EasyUI Tree异步加载JSON数据生成树的更多相关文章
- spring mvc easyui tree 异步加载树
使用spring mvc 注解 异步加载一棵树 jsp: <ul id="orgInfoTree"></ul> $(function(){ loadOrgT ...
- jquery easyui tree异步加载子节点
easyui中的树可以从标记中建立,也可以通过指定一个URL属性读取数据建立.如果想建立一棵异步树,需要为每个节点指定一个id属性值,这样在加载数据时会自动向后台传递id参数. <ul id=& ...
- EasyUI datagrid动态加载json数据
最近做一个项目,要求是两张张表可能查找出10多种不同的结果集. 如果想只用一个表格就把全部的结果不同的显示出来那么就肯定不同使用固定的字段名字,要通过动态加载后台返回来的数据把它显示出来就必须动态加载 ...
- 使用getJSON()方法异步加载JSON格式数据
使用getJSON()方法异步加载JSON格式数据 使用getJSON()方法可以通过Ajax异步请求的方式,获取服务器中的数组,并对获取的数据进行解析,显示在页面中,它的调用格式为: jQuery. ...
- Android-LoaderManager异步加载数据库数据
LoaderManager异步加载数据库数据,是在(Activity/fragment/其他UI等) 加载大量的本地Database库表数据,由于数据大在加载过程中会导致UI线程阻塞,导致用户体验不好 ...
- ztree插件的使用及列表项拖拽的实现(jQuery)+异步加载节点数据
为了实现如图所示的树状结构图,并使列表项可拖动到盒子里,研究了ztree这个插件的使用,并仔细研究了列表项的拖动事件.完成了预期需求,对jQuery的运用得到了提高.这个插件的功能非常强大,除了基本的 ...
- Android 应用开发 之通过AsyncTask与ThreadPool(线程池)两种方式异步加载大量数据的分析与对比--转载
在加载大量数据的时候,经常会用到异步加载,所谓异步加载,就是把耗时的工作放到子线程里执行,当数据加载完毕的时候再到主线程进行UI刷新.在数据量非常大的情况下,我们通常会使用两种技术来进行异步加载,一 ...
- Python爬虫爬取异步加载的数据
前言 本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理.作者:努力努力再努力 爬取qq音乐歌手数据接口数据 https://y.qq ...
- hive加载json数据解决方案
hive官方并不支持json格式的数据加载,默认支持csv格式文件加载,如何在不依赖外部jar包的情况下实现json数据格式解析,本编博客着重介绍此问题解决方案 首先创建元数据表: create EX ...
随机推荐
- xcode中如何安装多个版本的模拟器
在xcode里面,安装的时间默认自带的有模拟器,有时间为了调试需要使用个多个版本的模拟器 在xcode -> preference 里面 选择download,这里你可下载你需要的模拟器
- C# RSA加密/解密
RSA公钥加密算法是1977年由Ron Rivest.Adi Shamirh和LenAdleman在(美国麻省理工学院)开发的.RSA取名来自开发他们三者的名字.RSA是目前最有影响力的公钥加密算法, ...
- 你好,C++(3)2.1 一个C++程序的自白
第2部分 与C++第一次亲密接触 在浏览了C++“三分天下”的世界版图之后,便对C++有了基本的了解,算是一只脚跨入了C++世界的大门.那么,怎样将我们的另外一只脚也跨入C++世界的大门呢?是该即刻开 ...
- 怎么去掉iframe的滚动条?
<iframe name="123" src="YNJD/ynjd.htm" frameborder="0" width=" ...
- ARM架构下linux设备树加载的方法
引入设备树后bootloader加载DTB方法: 1. 标准方法 将linux kernel放到内存地址为<kernel img addr>的内存中. 将DTB放到地址为<dtb a ...
- 关于使用iframe标签自适应高度的使用
在ifrome内设定最小高度,(此方法只适用于页面内切换高度不一.但是会保留最大高度,返回后保持最大高度不再回到最初页面的高度) <iframe id="one4" widt ...
- js转换/Date(........)/
eval('new ' + (datetime.replace(/\//g, ''))); 好记性不如烂笔头,记下以备后用.
- java.io.serializable
为什么要实现 java.io.serializable? 简单点:“好处就是将来项目如果要做集群的话,就实现java.io.serializable接口”
- js控制 点一下增加一个输入框,点一下增加一个输入框……
<div> <div> 附件1:<input type="file" id="file1" name="file1&qu ...
- 【技术宅4】如何把M个苹果平均分给N个小朋友
$apple=array('apple1','apple2','apple3','apple4','apple5','apple6','apple7','apple8','apple9','apple ...