zTree 异步加载

时间:2021-07-27 04:09:33

zTree异步加载数据的简单实现,更为详细的Api请参考 zTree官网   http://www.treejs.cn/

 <link href="~/Content/ztree/css/zTreeStyle.css" rel="stylesheet" />
<script src="~/Content/ztree/js/jquery-1.4.4.min.js"></script>
<script src="~/Content/ztree/js/jquery.ztree.core.js"></script> <script type="text/javascript">
var setting = {
async: {
enable: true,
url: "/ZTree/LoadTree",//异步加载时的请求地址
autoParam: ["id"],//提交参数
type: 'get',
dataType: 'json'
},
checkable: true,
showIcon: true,
showLine: true,
data: {
simpleData: {
enable: true
}
},
expandSpeed: "",
callback: {
onClick: zTreeOnClick
}
}; $(document).ready(function () {
$.ajax({
url: '/ZTree/LoadTree',
type: 'get',
dataType: 'json',
success: function (data) {
$.fn.zTree.init($("#treeDemo"), setting, data);
}
});
}); //单击时获取zTree节点的Id,和value的值
function zTreeOnClick(event, treeId, treeNode, clickFlag) {
var treeValue = treeNode.id + "," + treeNode.name;
//alert(treeNode.id + "," + treeNode.name);
};
</script> <div>
<ul id="treeDemo" class="ztree"></ul>
</div>
 public class ZTreeController : Controller
{
//测试数据
List<TreeModel> list = new List<TreeModel>
{
new TreeModel { Id = , PId= , Name = "第一级 1", IsParent = true },
new TreeModel { Id = , PId= , Name = "第二级 1", IsParent = true },
new TreeModel { Id = , PId= , Name = "第三级 1", IsParent = false },
new TreeModel { Id = , PId= , Name = "第一级 2", IsParent = true },
new TreeModel { Id = , PId= , Name = "第二级 2", IsParent = true },
new TreeModel { Id = , PId= , Name = "第三级 2", IsParent = true },
new TreeModel { Id = , PId= , Name = "第四级 2", IsParent = true },
new TreeModel { Id = , PId= , Name = "第五级 2", IsParent = false }
}; public ActionResult Index()
{
return View();
} public string LoadTree(int id = )
{
List<TreeModel> listView = list.Where(p => p.PId == id).ToList(); var jsonSerializerSettings = new JsonSerializerSettings
{
ContractResolver = new CamelCasePropertyNamesContractResolver()
};
return JsonConvert.SerializeObject(listView, Formatting.None, jsonSerializerSettings);
} }

zTree 异步加载的更多相关文章

  1. ztree异步加载

    Ztree异步加载的意思就是: 当点击展开树节点时,才去请求后台action返回点击节点的子节点数据并加载. 直接贴代码(SpringMvc+Mybatis): 前台页面ztreeList.jsp: ...

  2. jquery zTree异步加载的例子

    下面是使用zTree异步加载的一个例子: 1)初始化树的时候是ajax请求,返回nodes列表来初始化树的:如果一开始就异步的话,$.fn.zTree.init($("#zTree&quot ...

  3. Ztree异步加载自动展开节点

    在Ztree的官网Demo中,有自动展开的例子,是通过设置节点属性open:true来实现自动展开的,但是在异步加载中,这个属性设置为true也不会自动展开,因为open:true是指在有子节点的情况 ...

  4. JQuery ztree 异步加载实践

    本来要做一个文件目录浏览界面,需要遍历所有的文件和目录,很显然一次性读取时很费时费力的一件事情. 因此就需要做异步加载.... 不过网上的几篇帖子还挺坑的!原始参考:JQuery异步加载实例,相对来说 ...

  5. 关于ztree异步加载的问题(二)

    本来以为这个异步加载会很难控制,因为考虑到ztree节点图标的控制,结果并不是那么困难,ztree自己控制图标,你只要在json中设置isParent:true,它自己会识别父节点并控制图标,以下是核 ...

  6. zTree异步加载并初始化树时全部展开(贴主要代码)

    <%@page pageEncoding="UTF-8"%> <%@include file="/commons/include/html_doctyp ...

  7. Jquery树控件ZTree异步加载

    异步加载的意思就是: 当点击展开树节点时,才去请求后台action返回点击节点的子节点数据并加载. 这里面主要设计ztree的setting变量的async属性设置: var setting = { ...

  8. 插件使用一树形插件---zTree一zTree异步加载

    zTree 可以实现异步加载.异步加载可以让初次加载速度快,带来好的用户体验. 异步加载 官方源码中的demo提示了例子.例子是采用php语言. 在java语言中,zTree如何与Servlet结合呢 ...

  9. ztree异步加载树节点

    参考文档:https://www.cnblogs.com/tenWood/p/8620708.html ztree api地址:http://www.treejs.cn/v3/api.php 说明:j ...

随机推荐

  1. arcgis for flex展示GIS基本功能

    1.地图框选搜索: 这是空间查询,在地图上框选一定的范围,然后搜索出在这个范围之内的所有信息,搜索到的详细信息在列表框显示出来 2.属性查询: 3.数据库展示: 4.绘制图形: 地图上绘制各种不同形状 ...

  2. ellipsis

    语法:  text-overflow : clip | ellipsis 参数:  clip : 不显示省略标记(...),而是简单的裁切(clip这个参数是不常用的!)      ellipsis ...

  3. AD7190学习笔记

    1 建议SCL空闲时会高电平. 2复位:上电后连续输入40个1(时钟周期)复位到已知状态,并等待500us后才能访问串行接口,用于SCLK噪音导致的同步. 3单次转换与连续转换(连续读取):每次转换是 ...

  4. 【Unity3D技术文档翻译】第1&period;8篇 AssetBundles 问题及解决方法

    上一章:[Unity3D技术文档翻译]第1.7篇 AssetBundles 补丁更新 本章原文所在章节:[Unity Manual]→[Working in Unity]→[Advanced Deve ...

  5. R语言常用函数:交集intersect、并集union、找不同setdiff、判断相同setequal

    在R语言进行数据分析时,经常需要找不同组间的相同和不同,那你应该掌握如下几个函数,让你事半功倍. 交集intersect两个向量的交集,集合可以是数字.字符串等 # 两个数值向量取交集intersec ...

  6. Javascript 2&period;9

    对象:属性和方法属性:隶属于某个特定对象的变量方法:只有某个特定对象才能调用的函数 对象和方法都用"."来访问: Object.property Object.method() 由 ...

  7. spring读取bean有几种方式

    bean加载到spring的方式: 第一种:xml 第二种:注释「一定要配合包扫描」: <context:component-scan base-package="Cristin.Co ...

  8. 高仿美团主界面&amp&semi;lt&semi;一&amp&semi;gt&semi;

    声明:本demo还未完好,正在持续更新中... 先上图吧: 这个小demo资源图片全是用青花瓷抠出来的,如今仅仅是完毕了 一部分. 会持续更行中. . .有兴趣的朋友能够关注我,我们一起coding, ...

  9. apply与call简单用法以及判断数组的坑

    1 typeof 和 instanceof var array = [];平时如果判断一个对象是否为数组,可能你会用 typeof array,但是输出为“object”. typeof 一般只能返回 ...

  10. From 易水寒 格局越大 人生越宽

    有这么一则故事:三个泥瓦匠在砌墙,一个人走过来,问他们在干什么. 第一个泥瓦匠没好气地说,你没看见吗?我在辛苦地砌墙呢.第二个回答,我们正在建一座高楼.第三个则洋溢着喜悦说,我们正在创造美好生活. 1 ...